jquery单行滚动

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>单行滚动</title>
<link rel="stylesheet" href="../base.css" />
<script src="../js/jquery.1.7.2.min.js" type="text/javascript">
</script>
<script src="../js/commom-public.js" type="text/javascript"></script>
<style type="text/css">

.wp{
    width:400px; margin:0 auto; height:32px; overflow:hidden;
    -webkit-box-shadow:1px 1px 4px #aaaaaa;
    -moz-box-shadow:1px 1px 4px #aaaaaa;
    -o-box-shadow:1px 1px 4px #aaaaaa;
    box-shadow:1px 1px 4px #aaaaaa;
    }
.j-srcollTop li{ height:30px; line-height:32px; border:1px dashed #dddddd;}
</style>
</head>

<body>
<div class="wp">
    <ul class="j-srcollTop">
        <li>news ! ews min1</li>
        <li>news ! ews2</li>
        <li>news ! ews3</li>
        <li>news ! ews4</li>
        <li>news ! ews5</li>
    </ul>
</div>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
<script type="text/javascript">

    function AutoScroll(obj){
    $(obj).find(".j-srcollTop").animate({
        marginTop:"-25px"
    },1000,function(){
        $(this).css({marginTop:"0px"}).find("li:first").appendTo($(this));
    });
}
$(document).ready(function(){
    setInterval('AutoScroll(".wp")',2000)
});
</script>

</body>
</html>

你可能感兴趣的:(jquery单行滚动)