图片随机显示技巧

　　图片随机显示是个应用很广泛的技巧。比如随机banner的显示，当您进入一个网站时他的banner总是不同的，或总有内容不同的提示（tips)，大家在网上浏览时会经常发现这样的例子。使用这种技术，不但能在一定的空间里放入更多的内容，还能够给人一种经常更新的假象喔。

　　怎么样心动了吧？其实只要您有一点点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！最后的代码是：

　　

　　试一下，是不是不错？那假如我的每一张图片都对应了一个超链接该怎么办呢？

　　我们还是来假设一下有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"，剩下的事就好办了。完整的代码如下：

　　

　　这只是个简单的例子，更有许多的功能能够实现，比如，设定图片的显示机率等，请到本人主页：http://www.avyes.com看看效果，我所学有限，只能抛砖引玉，还请各位大虾多多指点。(pc-king@21cn.com)。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有