jquery单行滚动

最新推荐文章于 2024-10-02 05:39:15 发布

weixin_33868027

最新推荐文章于 2024-10-02 05:39:15 发布

阅读量64

点赞数

文章标签： javascript xhtml python ViewUI

原文链接：https://my.oschina.net/blogsDdc/blog/101308

版权

2019独角兽企业重金招聘Python工程师标准>>>

<!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>

转载于:https://my.oschina.net/blogsDdc/blog/101308