您的位置:首页 > Web前端 > JavaScript

JavaScript 由左向右的图片渐变过渡

2016-07-11 11:05 555 查看
<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>由左向右的图片渐变</title>

</head>

<body>

<table width="778" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td><div id=oTransContainer

style="FILTER: progid:DXImageTransform.Microsoft.Wipe(GradientSize=1.0,wipeStyle=0, motion='forward'); WIDTH: 165px; HEIGHT: 103px"><a

href="/"

target=_blank><img class=pic id=oDIV1

style="BORDER-RIGHT: white 1px solid; BORDER-TOP: white 1px solid; BORDER-LEFT: white 1px solid; BORDER-BOTTOM: white 1px solid"

height=150 src="01.jpg"

border=0>

<script>var NowFrame = 1;var MaxFrame = 3;var bStart = 0;function fnToggle(){var next = NowFrame + 1;if(next == MaxFrame+1) {NowFrame = MaxFrame;next = 1;}if(bStart == 0){bStart = 1;setTimeout('fnToggle()', 2000);return;}else{oTransContainer.filters[0].Apply();document.images['oDIV'+next].style.display
= "";document.images['oDIV'+NowFrame].style.display = "none";oTransContainer.filters[0].Play(duration=2);if(NowFrame == MaxFrame){NowFrame = 1;}else{NowFrame++;}}
setTimeout('fnToggle()', 6000);}fnToggle();</script>

</a><a

href="/"

target=_blank><img class=pic id=oDIV2

style="BORDER-RIGHT: white 1px solid; BORDER-TOP: white 1px solid; DISPLAY: none; BORDER-LEFT: white 1px solid; BORDER-BOTTOM: white 1px solid"

height=150 src="02.jpg"

border=0></a><a

href="/"

target=_blank><img class=pic id=oDIV3

style="BORDER-RIGHT: white 1px solid; BORDER-TOP: white 1px solid; DISPLAY: none; BORDER-LEFT: white 1px solid; BORDER-BOTTOM: white 1px solid"

height=150 src="03.jpg"

border=0></a></div></td>

</tr>

</table>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: