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

Javascript
Javascript array类 数组操作方法
JavaScript 权威指南(第四版) 读书笔记
JQuery jsonp 使用示例代码
JavaScript 十六进制RGB色码转换器
一些不错的JS 自定义函数
javascript 不停(setInterval)/延时(setTimeout)函数使用实例
JS 添加删除元素的实现代码
jQuery 判断页面元素是否存在的代码
css+js完美控制图片大小
获取 textarea 标签第n行的文字的js代码
JavaScript 提升运行速度之循环篇 译文
js中的window.open返回object的错误的解决方法
javascript 客户端验证上传图片的大小(兼容IE和火狐)
用JavaScript将从数据库中读取出来的日期型格式化为想要的类型。
javascript addBookmark 加入收藏 多浏览器兼容
javascript 无提示关闭窗口脚本
jQuery select控制插件
jquery 入门教程 [翻译] 推荐
调用js时ie6和ie7,ff的区别
斜45度寻路实现函数

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


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