JS打造立体旋转的图片特效

最新推荐文章于 2022-12-09 14:32:05 发布

fxz_2010

最新推荐文章于 2022-12-09 14:32:05 发布

阅读量886

点赞数

分类专栏： javascript 文章标签： JavaScript HTML ViewUI

javascript 专栏收录该内容

30 篇文章 0 订阅

订阅专栏

<html>
<head>
</title>图片特效</title>
<SCRIPT language="JavaScript" type="text/javascript">

var wdmax=120; 
var wdmin=0; 
var inc=5; 
var rate = 50; 
var pause = 1000; 
var ff="flip"; 
function flipflop() {
if (ff=="flip") {
var wd = pic.width;
wd = wd - inc;
pic.width=wd;
if (wd==wdmin) {
pic.src="/jscss/demoimg/wall_s8.jpg"; inc=-inc;
}
if (wd==wdmax) {
ff="flop";
inc=-inc;
setTimeout("flipflop()",pause);
}
else {
setTimeout("flipflop()",rate);
}
}
else {
var ht = pic.height;
ht = ht - inc;
pic.height=ht;
if (ht==wdmin) {
pic.src="/jscss/demoimg/wall_s9.jpg"; inc=-inc;
} 
if (ht==wdmax) {
ff="flip";
inc=-inc;
setTimeout("flipflop()",pause);
}
else {
setTimeout("flipflop()",rate);
}
}
}
-->
</SCRIPT>
</head>
<center>
<body onLoad="javascript:flipflop()">
<TABLE border="0">
<th width="160">
<img src="/jscss/demoimg/wall_s9.jpg"  ID="pic">
</th>
</TABLE>
</body>
</html>