图片水平翻转后垂直翻反转的特效-JS特效-爱易网页

图片水平翻转后垂直翻反转的特效

日期：2014-05-18　浏览次数：20218 次

欢迎光临爱易网网页脚本特效中心，点击运行按钮演示特效：

以下是程序代码

<SCRIPT language="JavaScript" type="text/javascript">
//more javascript from http://www.aiyiweb.com
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="http://www.aiyiweb.com/images/face/image21.gif"; 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="http://www.aiyiweb.com/UploadPic/userface/no1323.jpg"; inc=-inc;
} 
if (ht==wdmax) {
ff="flip";
inc=-inc;
setTimeout("flipflop()",pause);
}
else {
setTimeout("flipflop()",rate);
}
}
}
-->
</SCRIPT>
<center>
<body onLoad="javascript:flipflop()">
<TABLE border="0">
<th width="160" height="160">
<img src="http://www.aiyiweb.com/images/logo.gif" width="120" height="120" ID="pic" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/>
</th></TABLE>
<a href="http://www.aiyiweb.com/js/">欢迎访问爱易网JS特效</a>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]