新浪微博首页“各人正在说”笔墨转动代码

发布时间：2018-08-20 08:39:09 所属栏目：编程来源：站长网

导读：新浪微博首页各人正在说笔墨转动代码，有伴侣喜好，于是就把代码扣下来，供各人进修。有淡入淡出的结果，新内容徐徐滚出来，旧内容逐步转动下去，貌似很新颖的一种方法。代码如下： !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http:

　　新浪微博首页“各人正在说”笔墨转动代码，有伴侣喜好，于是就把代码扣下来，供各人进修。

　　有淡入淡出的结果，新内容徐徐滚出来，旧内容逐步转动下去，貌似很新颖的一种方法。

　　代码如下：

<!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> <title>仿新浪微博首页“各人正在说”渐入轮显结果</title> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <style type="text/css"> *{margin:0;padding:0;font-size:12px;} ul{width:300px;height:400px;overflow:hidden;margin:50px 0 0 100px;} li{width:300px;border-bottom:1px solid #eee;margin-bottom:20px;} h4{border-bottom:1px solid #eee;} </style> </head> <body> <ul> <li> <h4>1、吃早餐都中毒了</h4> <p>是不是有点全都，吃早餐竟然食品中毒啊？</p> <p>2分钟前</p> </li> <li> <h4>2、30都市房价增高进7成</h4> <p>房奴注定当今社会的年轻人会很繁忙，一辈子会屋子奔忙……</p> <p>2分钟前</p> </li> <li> <h4>3、李玮峰进球了</h4> <p>李玮峰进球了，这是真的吗？</p> <p>2分钟前</p> </li> </ul> <script language="javascript"> var b=window.b||{}; b.roll=function (){ var me=this; setTimeout(function(){ me.x=document.getElementsByTagName("ul"); me.y=document.getElementsByTagName("li"); me.z=me.y.item(me.y.length-1); me.q=me.z.clientHeight; me.z.style.opacity=0; me.z.style.filter="alpha:(opacity=0)"; me.z.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+0+")"; me.z.style.height="0px"; me.x[0].insertBefore(me.z,me.y[0]); me.t=1; me.c=0 me.i=setInterval(function(){ me.t++; me.z.style.height=Math.round(me.q*(me.t/50)*(me.t/50))+"px"; if(me.t>=50){clearInterval(me.i); me.d=setInterval(function(){ me.c+=0.02 if("v"=="v"){ me.z.style.filter="alpha:(opacity="+me.c*100+")"; me.z.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+me.c*100+")"; } me.z.style.opacity=me.c; if(me.c>=1){clearInterval(me.d);} },50) } },25) b.roll(); },5000); } new b.roll(); </script> </body> </html><br /><center>如不能表现结果，请按Ctrl+F5革新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提醒：可修改儿女码再运行!

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

MySQL源码安置	运用图形界面从SQL导入
MySQL5.7+keepalived+	windows系统下jsp+mys