码迷,mamicode.com
首页 > Web开发 > 详细

Jquery无缝滚动

时间:2017-11-02 19:11:27      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:jquery   direct   --   href   hid   overflow   20px   rect   src   

<!--Style样式-->

<style>
*{margin:0;padding:0;}
body{font-size:12px; font-family:"微软雅黑"}
a{color:#333; text-decoration:none;}
ul{list-style:none;}
#marquee2{width:300px;height:25px;overflow:hidden; background:#EFEFEF; margin:20px auto 0;}
#marquee2 ul li{float:left; padding:0 10px; line-height:25px;}
</style>

<!--body部分-->

<div id="marquee2">
<ul>
<li><a href="#">新闻公告一</a><>
<li><a href="#">新闻公告二新闻公告二新闻公告二新闻公告二</a><>
<li><a href="#">新闻公告三新闻公告三</a><>
<li><a href="#">新闻公告四新闻公告四新闻公告四</a><>
<li><a href="#">新闻公告五新闻公告五新闻公告五</a><>
<li><a href="#">新闻公告六新闻公告六新闻公告六</a><>
</ul>
</div>

<!--两个js文件-->

<script src="js/jquery-1.3.2.min.js"></script>
<script src="js/jquery.kxbdMarquee.js"></script>

<!--Jquery部分向左滚动-->
<script>
(function(){
$("#marquee2").kxbdMarquee({isEqual:false});
})();
</script>

<!--Jquery部分向右滚动-->
<script>
(function(){
$("#marquee2").kxbdMarquee({isEqual:false,direction: "right"});
})();
</script>

<!--Jquery部分向上滚动,向上滚动需要在style里取消浮动-->
<script>
(function(){
$("#marquee2").kxbdMarquee({isEqual:false,direction: "up"});
})();
</script>

<!--Jquery部分向上滚动,向下滚动需要在style里取消浮动-->
<script>
(function(){
$("#marquee2").kxbdMarquee({isEqual:false,direction: "down"});
})();
</script>

Jquery无缝滚动

标签:jquery   direct   --   href   hid   overflow   20px   rect   src   

原文地址:http://www.cnblogs.com/zcy1995/p/7773658.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!