当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript:实现滚动带链接的字幕

Javascript
javascript:以前写的xmlhttp池,代码
javascript firefox兼容ie的dom方法脚本
常用的javascript function代码
javascript Discuz代码中的msn聊天小功能
js 简单类代码
分离式javascript取当前element值的代码
javascript document.images实例
javascript 调用其他页面的js函数或变量的脚本
javascript一点特殊用法
js中cookie的使用详细分析
javascript实现通过拼音首字母快速选择下拉列表
javascript解析xml字符串的函数
用javascript和css模拟select的脚本
javascript操作select参考代码
javascript String 的扩展方法集合
javascript数组的扩展实现代码集合
宝儿的zQuery库选择器简单原型
超级经典一套鼠标控制左右滚动图片带自动翻滚
javascript关键字加亮加连接
JavaScript 应用类库代码

Javascript 中的 JavaScript:实现滚动带链接的字幕


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-10   浏览: 577 ::
收藏到网摘: n/a

  大家都见过字幕,但字幕的形式却是活波的,变化的,今天我们使用JS实现滚动带连接的字幕,例子源码如下:

<script language=javascript>
<!--
var index = 3
link = new Array(3);
text = new Array(3);

link[0] ='http://www.cpcw.com/'
link[1] ='http://www.dscj.org/'
link[2] ...

......

text[0] ='电脑报'
text[1] ='点石成金'
text[2] ...

......



效果演示


document.write ("<marquee scrollamount='1' scrolldelay='50' direction= 'up' width='80' height='40'
onmouseover='this.stop()' onmouseout='this.start()'>");

for (i=0;i<index;i++){
document.write (" <a href="+link[i]+" target='_blank'>");
document.write (text[i] + "</A><br>");
}
document.write ("</marquee>")
// -->
</script>



  代码分析:

  其中“var index =” 数字可以根据您的要求随意更改数值,其值为您连接字幕的条数;link为连接的
地址,text为字幕的文字描述;scrollamount、 scrolldelay为字幕的延迟时间和显示数量,可以自己调节
比例;direction为滚动方式,可以自己改为上下左右;width、height为字幕区域的宽高度target='_blank',为连接地址在新窗口中打开;“onmouseover=”“onmouseout=”为鼠标事件,当鼠标接近时停止滚动,如果您不 喜欢这样可以把它删掉,字幕就会一直滚动了。

  补充说明:

  如果你的页面使用js这种程序多了,加上HTML标记代码,你的源文件看上去就会十分庞大,使HTML文档可读性不强。我们可以从html代码中把<!-->和// -->之间的代码分离出来,存成一个.js文件就易于管理了,在更新连接时直接更新.js即可,而且代码看上去也规整多了。例如请将上面这段代码copy到你的记事本里,然后选择文件->另存为,在输入框中键入"zimu.js"(注意:引号千万不能少,以便保证你存储的文件的括展名是.js),然后在你页面的<head>和</head>之间加入<script language="javascript" src="路径/zimu.js"></script>,就可以调用这个js文件了!

  好了,我们今天的滚动字幕就完成了,怎么样,自己快动手做做看吧,有问题来我的主页(http://www.dscj.org)留言给我,我会及时给大家回复的!