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

Javascript
js 判断 enter 事件
谷歌浏览器 insertCell与appendChild的区别
从JavaScript 到 JQuery (1)学习小结
JavaScript实现动态增加文件域表单
JavaScript DOM 添加事件
Javascript 跨域访问解决方案
检测是否已安装 .NET Framework 3.5的js脚本
JavaScript 获得选中文本内容的方法
Javascript 获取链接(url)参数的方法
javascript Ext JS 状态默认存储时间
动态为事件添加js代码示例
JSON扫盲帖 JSON.as类教程
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
js实现权限树的更新权限时的全选全消功能
javascript Table 中2个列(TD)的交换实现代码
js表数据排序 sort table data
javascript css在IE和Firefox中区别分析
JAVASCRIPT IE 与 FF中兼容问题小结
判断多个元素(RADIO,CHECKBOX等)是否被选择的原理说明
csdn 批量接受好友邀请

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-10   浏览: 544 ::
收藏到网摘: 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)留言给我,我会及时给大家回复的!