随笔 - 147  文章 - 71  trackbacks - 0
<2009年1月>
28293031123
45678910
11121314151617
18192021222324
25262728293031
1234567

常用链接

留言簿(1)

随笔分类(146)

随笔档案(147)

文章分类(28)

文章档案(28)

喜欢的Blog

搜索

  •  

最新评论

阅读排行榜

评论排行榜

读取图像属性
1<img src="/”image1.jpg"” name=”myImage”> 
2<href=”# ” onClick=”window.alert(document.myImage.width)”>Width</a>

动态加载图像
1<script language=”JavaScript”> 
2 myImage = new Image;
3 myImage.src = “Tellers1.jpg”;
4
</script>

简单的图像替换
1<script language=”JavaScript”> 
2 rollImage = new Image; 
3 rollImage.src = “rollImage1.jpg”; 
4 defaultImage = new Image; 
5 defaultImage.src = “image1.jpg”; 
6
</script> 
7 <href="/”myUrl"” onMouseOver=”document.myImage.src = rollImage.src;” 
8 onMouseOut=”document.myImage.src = defaultImage.src;”> 
9 <img src="/”image1.jpg"” name=”myImage” width=100 height=100 border=0>

随机显示图像
1<script language=”JavaScript”> 
2 var imageList = new Array; 3: imageList[0= “image1.jpg”; 
3 imageList[1= “image2.jpg”; 
4 imageList[2= “image3.jpg”; 
5 imageList[3= “image4.jpg”; 
6 var imageChoice = Math.floor(Math.random() * imageList.length); 
7 document.write(‘<img src=”’ + imageList[imageChoice] + ‘“>’); 
8
</script>

函数实现的图像替换
 1<script language=”JavaScript”> 
 2 var source = 0
 3 var replacement = 1
 4 function createRollOver(originalImage,replacementImage) {  
 5 var imageArray = new Array; 
 6 imageArray[source] = new Image; 
 7 imageArray[source].src = originalImage; 
 8 imageArray[replacement] = new Image; 
 9 imageArray[replacement].src = replacementImage; 
10 return imageArray; 
11 }
 
12 var rollImage1 = createRollOver(“image1.jpg”,”rollImage1.jpg”); 
13
</script> 
14 <href=”#” onMouseOver=”document.myImage1.src = rollImage1[replacement].src;” 
15 onMouseOut=”document.myImage1.src = rollImage1[source].src;”> 
16 <img src="/”image1.jpg"” width=100 name=”myImage1” border=0> 
17 </a>

创建幻灯片
 1<script language=”JavaScript”> 
 2 var imageList = new Array; 
 3 imageList[0= new Image; 
 4 imageList[0].src = “image1.jpg”; 
 5 imageList[1= new Image; 
 6 imageList[1].src = “image2.jpg”; 
 7 imageList[2= new Image; 
 8 imageList[2].src = “image3.jpg”; 
 9 imageList[3= new Image; 
10 imageList[3].src = “image4.jpg”; 
11 function slideShow(imageNumber) {  
12 document.slideShow.src = imageList[imageNumber].src; 
13 imageNumber += 1
14 if (imageNumber < imageList.length) {  
15 window.setTimeout(“slideShow(“ + imageNumber + “)”,3000); 
16 }
 
17 }
 
18
</script> 
19 </head> 
20 <body onLoad=”slideShow(0)”> 
21 <img src="/”image1.jpg"” width=100 name=”slideShow”>

随机广告图片
 1<script language=”JavaScript”> 
 2 var imageList = new Array; 
 3 imageList[0= “image1.jpg”; 
 4 imageList[1= “image2.jpg”; 
 5 imageList[2= “image3.jpg”; 
 6 imageList[3= “image4.jpg”; 
 7 var urlList = new Array; 
 8 urlList[0= “http://some.host/”; 
 9 urlList[1= “http://another.host/”; 
10 urlList[2= “http://somewhere.else/”; 
11 urlList[3= “http://right.here/”; 
12 var imageChoice = Math.floor(Math.random() * imageList.length); 
13 document.write(‘<a href=”’ + urlList[imageChoice] + ‘“><img src=”’ + imageList[imageChoice] + ‘“></a>’); 
14
</script>
posted on 2009-01-23 15:23 飞翔天使 阅读(592) 评论(1)  编辑  收藏 所属分类: javascript

FeedBack:
# re: JavaScript方法和技巧大全——图像 2009-01-24 07:57 heyang
不错!  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航: