您当前的位置: 首页 » HTML/XHTML/XML编程 » 图片渐变轮换效果
图片渐变轮换效果
论坛链接
<html>
<head>
<title>图片渐变轮换效果 - 51windows.Net</title>
<meta name="generator" content="editplus">
<meta name="author" content="51windows.net">
</head>
<body>
<p>图片渐变轮换效果(IE),请等几秒钟看效果</p>
<a href="#" id="javascript.a"><img src="http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01015_119.JPG" id="javascript.img" border=0 style="filter:blendTrans(duration=2)" width="240" height="180"></a>
<script>
<!--
var ImgSrc = new Array();//图片地址
ImgSrc[0] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01087_0122.JPG"
ImgSrc[1] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01384_582.JPG"
ImgSrc[2] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01015_119.JPG"
ImgSrc[3] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_05132_31.JPG"
ImgSrc[4] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_05809_1005.JPG"
ImgSrc[5] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_06257_84.JPG"
ImgSrc[6] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_06316_153.JPG"
ImgSrc[7] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_BK-Lewis&Clarkp6-7.JPG"
for (var i=0;i<ImgSrc.length;i++){(new Image()).src = ImgSrc;}//预加载图片
var ImgAlt = new Array();//鼠标放上去显示的文字
ImgAlt[0] = "美国《国家地理杂志》1"
ImgAlt[1] = "美国《国家地理杂志》2"
ImgAlt[2] = "美国《国家地理杂志》3"
ImgAlt[3] = "美国《国家地理杂志》4"
ImgAlt[4] = "美国《国家地理杂志》5"
ImgAlt[5] = "美国《国家地理杂志》6"
ImgAlt[6] = "美国《国家地理杂志》7"
ImgAlt[7] = "美国《国家地理杂志》8"
var ImgHerf = new Array();//链接
ImgHerf[0] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_01.htm"
ImgHerf[1] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_02.htm"
ImgHerf[2] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_03.htm"
ImgHerf[3] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_04.htm"
ImgHerf[4] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_05.htm"
ImgHerf[5] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_06.htm"
ImgHerf[6] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_07.htm"
ImgHerf[7] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_08.htm"
var step=0;
function slideit(){
//rewrite by haiwa@2005-7-7
var oImg = document.getElementById("javascript.img");
if (document.all){oImg.filters.blendTrans.apply();}
oImg.src=ImgSrc[step];
document.getElementById("javascript.a").href=ImgHerf[step];
oImg.title=ImgAlt[step];
if (document.all){oImg.filters.blendTrans.play();}
step = (step<(ImgSrc.length-1))?(step+1):0;
(new Image()).src = ImgSrc[step];//加载下一个图片
}
setInterval("slideit()",3000);
//-->
</script>
</body>
</html>
<head>
<title>图片渐变轮换效果 - 51windows.Net</title>
<meta name="generator" content="editplus">
<meta name="author" content="51windows.net">
</head>
<body>
<p>图片渐变轮换效果(IE),请等几秒钟看效果</p>
<a href="#" id="javascript.a"><img src="http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01015_119.JPG" id="javascript.img" border=0 style="filter:blendTrans(duration=2)" width="240" height="180"></a>
<script>
<!--
var ImgSrc = new Array();//图片地址
ImgSrc[0] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01087_0122.JPG"
ImgSrc[1] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01384_582.JPG"
ImgSrc[2] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_01015_119.JPG"
ImgSrc[3] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_05132_31.JPG"
ImgSrc[4] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_05809_1005.JPG"
ImgSrc[5] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_06257_84.JPG"
ImgSrc[6] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_06316_153.JPG"
ImgSrc[7] = "http://www.51windows.net/mypic/Usa_geography/pic2006/TN_BK-Lewis&Clarkp6-7.JPG"
for (var i=0;i<ImgSrc.length;i++){(new Image()).src = ImgSrc;}//预加载图片
var ImgAlt = new Array();//鼠标放上去显示的文字
ImgAlt[0] = "美国《国家地理杂志》1"
ImgAlt[1] = "美国《国家地理杂志》2"
ImgAlt[2] = "美国《国家地理杂志》3"
ImgAlt[3] = "美国《国家地理杂志》4"
ImgAlt[4] = "美国《国家地理杂志》5"
ImgAlt[5] = "美国《国家地理杂志》6"
ImgAlt[6] = "美国《国家地理杂志》7"
ImgAlt[7] = "美国《国家地理杂志》8"
var ImgHerf = new Array();//链接
ImgHerf[0] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_01.htm"
ImgHerf[1] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_02.htm"
ImgHerf[2] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_03.htm"
ImgHerf[3] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_04.htm"
ImgHerf[4] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_05.htm"
ImgHerf[5] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_06.htm"
ImgHerf[6] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_07.htm"
ImgHerf[7] = "http://www.51windows.net/mypic/Usa_geography/pic2006/page_08.htm"
var step=0;
function slideit(){
//rewrite by haiwa@2005-7-7
var oImg = document.getElementById("javascript.img");
if (document.all){oImg.filters.blendTrans.apply();}
oImg.src=ImgSrc[step];
document.getElementById("javascript.a").href=ImgHerf[step];
oImg.title=ImgAlt[step];
if (document.all){oImg.filters.blendTrans.play();}
step = (step<(ImgSrc.length-1))?(step+1):0;
(new Image()).src = ImgSrc[step];//加载下一个图片
}
setInterval("slideit()",3000);
//-->
</script>
</body>
</html>