资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
Js仿新浪微博首页内容滚动
然后在新浪微博首页仍然在使用哦,可能我写的代码还不是最佳优化状态,但是我觉得这已经不错了。
<!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=gb2312" /> <title>仿新浪微博首页内容滚动</title> <style type="text/css"> body{background:#efc;} </style> </head> <body> <!-- col-act --> <div class="col-act"> <div class="colAct-list clear" id="actDbList" > <!-- turn --> <dl class="clear" > <dt>-------------------------------------</dt> <dd>---------------------------------------</dd> <dd>---------------------------------------</dd> </dl> <!-- turn end --> </div> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A%2F*--------------%E6%96%B0%E9%B2%9C%E4%BA%8B%E6%BB%9A%E5%8A%A8----------------*%2F%20%0D%0Avar%20_num%3D_n%3D0%2C%20%0D%0A_autohidden%2C_arrObj%2C_oHeight%3B%20%0D%0Afunction%20flilter(elem%2Ci%2Ct)%7B%20%0D%0Avar%20o%3Ddocument.getElementById(%22actDbList%22)%3B%20%0D%0Aif(!o)%20return%20false%3B%20%0D%0Avar%20elem%3Do.getElementsByTagName(%22dl%22)%5B0%5D%3B%20%0D%0Aif%20(elem.movement)%20%7B%20%0D%0AclearTimeout(elem.movement)%3B%20%0D%0A%7D%20%0D%0Aif%20(!_n%3D%3D%3D0)%20_n%20%3D%20parseInt(elem%5B'style'%5D%5B!-%5B1%2C%5D%3F'filter'%3A'opacity'%5D)%3B%20%0D%0Aif(_n%3E%3Di)%7B%20%0D%0Areturn%20true%3B%20%0D%0A%7D%20%0D%0Aif%20(_n%20%3C%20i)%20%7B%20%0D%0Avar%20dist%20%3D%20Math.ceil((i%20-%20_n)%2F10)%3B%20%0D%0A_n%20%3D%20_n%20%2B%20dist%3B%20%0D%0A%7D%20%0D%0Aif%20(_n%20%3E%20i)%20%7B%20%0D%0Avar%20dist%20%3D%20Math.ceil((i%20-%20_n)%2F10)%3B%20%0D%0A_n%20%3D%20_n%20-%20dist%3B%20%0D%0A%7D%20%0D%0Aelem%5B'style'%5D%5B!-%5B1%2C%5D%3F'filter'%3A'opacity'%5D%3D!-%5B1%2C%5D%3F'alpha(opacity%3D'%2B_n%2B')'%3A_n%2F100%3B%20%0D%0Avar%20repeat%20%3D%20%22flilter('%22%2Belem%2B%22'%2C%22%2Bi%2B%22%2C%22%2Bt%2B%22)%22%3B%20%0D%0Aelem.movement%20%3D%20setTimeout(repeat%2Ct)%3B%20%0D%0A%7D%20%0D%0Afunction%20moveElement(elem%2Cfinal_y%2Cinterval)%20%7B%20%0D%0Avar%20o%3Ddocument.getElementById(%22actDbList%22)%3B%20%0D%0Aif(!o)%20return%20false%3B%20%0D%0Avar%20elem%3Do.getElementsByTagName(%22dl%22)%5B0%5D%3B%20%0D%0Aif%20(elem.movement)%20%7B%20%0D%0AclearTimeout(elem.movement)%3B%20%0D%0A%7D%20%0D%0Aif%20(!elem.style.height)%20%7B%20%0D%0Aelem.style.height%20%3D%20%220%22%3B%20%0D%0A%7D%20%0D%0Avar%20ypos%20%3D%20parseInt(elem.style.height)%3B%20%0D%0A%0D%0Aif%20(ypos%20%3D%3D%20final_y)%20%7B%20%0D%0Aflilter(o.getElementsByTagName(%22dl%22)%5B0%5D%2C100%2C40)%3B%20%0D%0Areturn%20true%3B%20%0D%0A%7D%20%0D%0Aif%20(ypos%20%3C%20final_y)%20%7B%20%0D%0Avar%20dist%20%3D%20Math.ceil((final_y%20-%20ypos)%2F10)%3B%20%0D%0Aypos%20%3D%20ypos%20%2B%20dist%3B%20%0D%0A%7D%20%0D%0Aif%20(ypos%20%3E%20final_y)%20%7B%20%0D%0Avar%20dist%20%3D%20Math.ceil((ypos%20-%20final_y)%2F10)%3B%20%0D%0Aypos%20%3D%20ypos%20-%20dist%3B%20%0D%0A%7D%20%0D%0Aelem.style.height%20%3D%20ypos%20%2B%20%22px%22%3B%20%0D%0Avar%20repeat%20%3D%20%22moveElement('%22%2Belem%2B%22'%2C%22%2Bfinal_y%2B%22%2C%22%2Binterval%2B%22)%22%3B%20%0D%0Aelem.movement%20%3D%20setTimeout(repeat%2Cinterval)%3B%20%0D%0A%7D%20%0D%0Afunction%20step(obj)%7B%20%0D%0Avar%20_arrO%3Ddocument.getElementById(%22DB%22)%3B%20%0D%0Aif(!_arrO)%20return%20false%3B%20%0D%0Avar%20_arr%3D_arrO.getElementsByTagName(%22dl%22)%3B%20%0D%0Aif%20(_autohidden)%20%7B%20%0D%0AclearInterval(_autohidden)%3B%20%0D%0A%7D%20%0D%0A_n%3D0%3B%20%0D%0A_arrObj%3D_arr%5B_num%5D%3B%20%0D%0A_max%3D_arr.length%3B%20%0D%0Avar%20o%3Ddocument.getElementById(obj)%3B%20%0D%0Avar%20newNode%3D%20document.createElement(%22dl%22)%3B%20%0D%0Ao.insertBefore(newNode%2Co.getElementsByTagName(%22dl%22)%5B0%5D)%3B%20%0D%0Avar%20s%3Do.getElementsByTagName(%22dl%22)%5B0%5D%3B%20%0D%0As.style.cssText%3D%22height%3A0%3Bopacity%3A0%3Bfilter%3AAlpha(opacity%3D0)%3Boverflow%3Ahidden%22%3B%20%0D%0As.style.className%3D%22clear%22%3B%20%0D%0As.innerHTML%3D_arrObj.innerHTML%3B%20%0D%0A_oHeight%3D_arrObj.offsetHeight%3B%20%0D%0AmoveElement(s%2C_oHeight%2C10)%3B%20%0D%0Avar%20lastNode%3Do.getElementsByTagName(%22dl%22)%5B(o.getElementsByTagName(%22dl%22).length-1)%5D%3B%20%0D%0Avar%20reLastNode%3Do.removeChild(lastNode)%3B%20%0D%0A_num%2B%2B%3B%20%0D%0Aif(_num%3E%3D_max)%7B%20%0D%0A_num%3D0%3B%20%0D%0A%7D%20%0D%0AstopMove(%22actDbList%22)%3B%20%0D%0A_autohidden%20%3D%20setTimeout(function()%7Bstep(obj)%3B%7D%2C5000)%3B%20%0D%0A%7D%20%0D%0Afunction%20stopMove(o)%7B%20%0D%0Avar%20o%3Ddocument.getElementById(o)%3B%20%0D%0Aif(!o)%20return%20false%3B%20%0D%0Ao.onmouseover%3Dfunction()%7B%20%0D%0Aif%20(_autohidden)%20%7B%20%0D%0AclearTimeout(_autohidden)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Ao.onmouseout%3Dfunction()%7B%20%0D%0A_autohidden%20%3D%20setTimeout(function()%7Bstep(%22actDbList%22)%3B%7D%2C5000)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%2F*--------------%E6%96%B0%E9%B2%9C%E4%BA%8B%E6%BB%9A%E5%8A%A8%E7%BB%93%E6%9D%9F----------------*%2F%20%0D%0A_autohidden%20%3D%20setInterval(function()%7Bstep(%22actDbList%22)%3B%7D%2C1000)%3B%20%0D%0AstopMove(%22actDbList%22)%3B%20%0D%0A%3C%2Fscript%3E"> <div class="" id="DB"> <!-- --> <dl > <dt>我记得我爱过(电视剧《泡沫之夏》主题曲)-何润东</dt> </dl> <!-- --> <dl > <dd>#我最喜欢的书#绝对不是言情和校园谈恋爱的那种,就是无聊的,只有看那些书的时候,我也一个字看不进。其它的书还都蛮喜欢的,嘿嘿</dd> </dl> <!-- --> <dl > <dt>等会儿又要飞了,好想死。旁边放把剪刀,实在写不出东西来,随时准备从天灵盖插下去……</dt> </dl> <!-- --> <dl > <dt>有人质疑我"发福了,老了,唱不动了"。我早已不把这些话放在心上。</dt> </dl> <!-- --> <dl > <dt>记录心情,记录生活点滴,欢迎走进腾讯微博。</dt> <dd>欢乐无从,快乐从心!</a> </dd> </dl> <!-- --> </div> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程