由于marquee标签现在用得是越来越少了,所以滚动效果的做法大多也都改用javascript来实现了,至于不明白为什么不直接用marquee标签的朋友,不妨先阅读一下这篇文章。第一种方法:用javascript模拟marquee的做法。出处:网易游戏
热点新闻
滚动新闻
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]个人观点:从web可用性角度上讲,我们在采用这段代码的同时要考虑到noscript环境下的可用性,建议将内容还是以下边代码的形式出现在页面中。如:复制代码 代码如下:<div id="newslist"> <ul> <li><a href=http://xyq.163.com/news/2006/11/2-2-20061102170913.html target=_blank>用“梦幻密保”快速取回帐号密码</a></li> <li><a href=http://ekey.163.com/ target=_blank>网易将军令官方网站</a></li> <li><a href=http://xyq.163.com/download/wallpaper.htm target=_blank>最新壁纸下载</a></li> <li><a href=http://xyq.163.com/download/around.htm target=_blank>最新屏保下载</a></li> </ul> </div>然后用脚本去设置隐藏,将列表项读进javascript中定义的数组中。即可达到在noscript环境下也能正常看到内容列表。第二种方法:这个更强,能自动根据内容自动进行左右滚动,解决了宽度太小造成的截取问题。原文作者:风动人
SCROLL
#infozone{font-size:12px;color:#aa6;overflow:hidden;width:100px;height:20px;}
#infozone div{height:20px;line-height:20px;white-space:nowrap;overflow:hidden;}
温岚 - 屋顶(周杰伦 对唱版)范玮琪 - 那些花儿张韶涵 - 娃娃孙楠&韩红 - 美丽的神话
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]个人观点:从xhtml的语义化的角度看,页面内容中滥用div标签现象比较严重,可改成ul/li形式。第三种是最精简的,代码非常少。原文作者:cityvoice
New Document
#newslist{
background:#f7f7f7;border:1px solid silver;padding:1px;height:20px;line-height:20px;width:300px;
}
#contain{
font-size:12px;overflow:hidden;list-style:none;width:300px;height:20px;margin:0px;padding:0;
}
#contain li{
height:20px;line-height:20px;white-space:nowrap;overflow:hidden;
}
温岚 - 屋顶(左右摆动)
范玮琪 - 那些花儿
张韶涵 - 娃娃
孙楠&韩红 - 美丽的神话
张信哲 - 白月光
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]个人观点:太短小精干了,如果你喜欢简单的话,这个也可以考虑的。
推荐阅读
另一种希望别人无法修改js的代码
我们对js加密的目的是希望别人无法修改,那么我们可以在JS的复杂度上下点功夫,用模块化的开发,这个函数引用那个函数,这个对象继承自那个对象.....反反复复,很快别人就会晕掉.......当然以后自己调试或者修改的时候也>>>详细阅读
本文标题:用javascript代替marquee的滚动字幕效果代码
地址:http://www.17bianji.com/kaifa2/JS/30496.html
1/2 1