最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
图片随机显示技巧
时间:2022-07-02 13:25:04 编辑:袖梨 来源:一聚教程网
怎么样心动了吧?其实只要你有一点点html和javascript 的基础,一切都是这么简单。follow me,让我们来看看她随机的奥密。
让我们从一个简单的例子开始吧。平常我们在页面中加入图片都是用来完成。如果我们要随机显示3张不同的图片就要对这句代码进行小小的修改,首先加入 标记:
然后在这段标记内把用document.write("")的型式放进去,就成了
document.write("")
现在我们来完成最关建的一段:
id=Math.round(Math.random()*2)+1
这样取得随机数为1,2,3将你要显示的图片改名为1.gif,2.gif,3.gif,ok!最后的代码是:
id=Math.round(Math.random()*2)+1
document.write("")
试一下,是不是不错?那如果我的每一张图片都对应了一个超链接该怎么办呢?
我们还是来假设一下有3张图片,1.gif,2.gif,3.gif,分别对应的链接是url1,url2,url3。
为了让图片和链接一一对应,我们要设置一个数组image来放置链接的地址,如下:
var image=new Array(3)
image.length=3
image[1]="url1"
image[2]="url2"
image[3]="url3"
为了将与图片对应的链接取出来,我们还要定义一个数组imageurl=image[id]
原理是这样的:
当页面被读入时,取一个随机数,假设是2即id=2,那么如上我们可轻松的完成2.gif在页面的显示。然后我们可以看到:imageurl=image[2]而image[2]="url2",剩下的事就好办了。完整的代码如下:
var image=new Array(3)
image.length=3
image[1]="url1"
image[2]="url2"
image[3]="url3"
id=Math.round(Math.random()*2)+1
imageurl=image[id]
document.write(""+"")
这只是一个简单的例子,还有许多的功能可以实现,比如,设定图片的显示机率等,请到本人主页:http://w**ww*.avyes.com看看效果,我所学有限,只能抛砖引玉,还请各位大虾多多指点。([email protected])。
相关文章
- 美女视频软件全免费-美女主播直播全免费 02-10
- 女神漫画免费阅读在线观看最新版本下载安装-女神漫画全集高清完整版免费漫画入口页面 02-10
- 豆包网页版官方入口-豆包AI人工智能在线体验 02-10
- 成何体统电视剧32集全集:高清在线观看(免下载直达) 02-10
- 学科网登录入口-中小学学科网官网电脑版 02-10
- QQ网页版扫码登录入口-QQ网页版文件传输入口 02-10