1. 程式人生 > >Jquery無縫滾動

Jquery無縫滾動

rip dir padding 文件 新聞 -- ora spa js文件

<!--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無縫滾動