图片的拉伸翻转
第一步:把如下代码加入<body>区域中
<SCRIPT language="JavaScript" type="text/javascript">
<!--hide
//STEP 1: PUT THIS CODE INTO THE HEAD OF YOUR DOCUMENT
var wdmax=120; //set maximum width of square image (px)
var wdmin=0; //set minimum thickness of edge-on image (px)
var inc=5; //set step change in px (wdmax-wdmin must be a multiple) )These two variables
var rate = 50; //pause between steps (in millisec) )determine flip-flop speed
var pause = 1000; //pause between flip and flop (in millisec)
var ff="flip"; //initialise whether movement starts with a "flip" (sideways) or "flop" (vertical) change.
function flipflop() {
if (ff=="flip") {
var wd = document.getElementById("pic").getAttribute("width");
wd = wd - inc;
document.getElementById("pic").setAttribute("width",wd);
if (wd==wdmin) {
document.getElementById("pic").setAttribute("src","photo/pic200211062.gif"); //substitute name of your second picture
inc=-inc;
}
if (wd==wdmax) {
ff="flop";
inc=-inc;
setTimeout("flipflop()",pause);
}
else {
setTimeout("flipflop()",rate);
}
}
else {
var ht = document.getElementById("pic").getAttribute("height");
ht = ht - inc;
document.getElementById("pic").setAttribute("height",ht);
if (ht==wdmin) {
document.getElementById("pic").setAttribute("src","photo/pic200211061.gif"); //substitute name of your first picture
inc=-inc;
}
if (ht==wdmax) {
ff="flip";
inc=-inc;
setTimeout("flipflop()",pause);
}
else {
setTimeout("flipflop()",rate);
}
}
}
-->
</SCRIPT>
<center>
<TABLE border="0">
<th width="160" height="160">
<IMG src="photo/pic200211061.gif" width="120" height="120" ID="pic">
</th></TABLE>
第二步:把如下代码加入<body>区域中<body onLoad="javascript:flipflop()">
