与我们合作
我们专注:网站策划设计、网络多媒体传播、网站优化及网站营销、品牌策略与设计
主营业务:网站建设、移动端微信小程序开发、VI设计、网络运营、云产品·运维解决方案
有一个品牌项目想和我们谈谈吗?
您可以填写右边的表格,让我们了解您的项目需求,这是一个良好的开始,我们将会尽快与您取得联系。当然也欢迎您给我们写信或是打电话,让我们听到您的声音
您也可通过下列途径与我们取得联系:
地 址: 深圳.龙岗区大运软件小镇11栋3楼
电 话: 138 2888 4598 / 138 0880 9053
网 址: http://www.appvx.cn
快速提交您的需求 ↓
jquery滚动新闻公告效果
时间:2017-06-30 浏览:3821 编辑:唯丽是从 来源:
仿Twitter的公告效果:
方法如下:
1、HTML 部分:
<ul id=”twitter”>
<li>第一条消息</li>
<li>第二条消息</li>
<li>第三条消息</li>
</ul>
关于输出 twitter 消息的方法很多,有兴趣的朋友可以看一下。
2、载入 JQuery
直接用 google 托管的就行。
<script type=”text/javascript”src=”http://ajax.googleapis.com/ajax/libs/jquery
/1.2.6/jquery.min.js”></script>
3、JQuery 执行代码
$(document).ready(function(){
$(“#twitter li:not(:first)”).css(“display”,”none”);
var B=$(“#twitter li:last”);
var C=$(“#twitter li:first”);
setInterval(function(){
if(B.is(“:visible”)){
C.fadeIn(500).addClass(“in”);B.hide()
}else{
$(“#twitter li:visible”).addClass(“in”);
$(“#twitter li.in”).next().fadeIn(500);
$(“li.in”).hide().removeClass(“in”)}
},3000) //每3秒钟切换一条,你可以根据需要更改
})