本帖最后由 CrLf 于 2014-8-17 17:23 编辑
代码为转载
从存货里翻出来的，其实是个很简单的功能，但当示例不错： | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | | <html xmlns="http://www.w3.org/1999/xhtml"> | | <head> | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> | | | | <style type="text/css"> | | html{ | | overflow:hidden; | | } | | .body { | | background-repeat:repeat; | | height:2000px; | | width: 2000px; | | } | | button { | | boder:0; | | height: 20px;width:61px; | | } | | </style> | | </head> | | | | <SCRIPT Language="JavaScript"> | | function Move(a,b,c,d){ | | A="on";B="on"; | | if (a<c) {X=('+')} else {X=('-')} | | if (b<d) {Y=('+')} else {Y=('-')} | | if (b==d) B="off";if (a==c) A="off" | | for (H=0;H<=2000;H++) { | | parent.scroll(a,b) | | if (A=="on") eval("a"+X+"=1") | | if (B=="on") eval("b"+Y+"=1") | | } | | } | | </SCRIPT> | | | | | | <body style="background-color: #707070; background-image: url('background.bmp');width: 81px; height: 610px" class="style1" > | | <div class="body"> | | | | | | <div style="position: absolute; width: 500px; height: 500px; z-index: 1; left: 0px; top: 0px; background: red" id="layer1"> | | <button onClick="Move(0,0,0,2000)">Green</BUTTON><br> | | <button value="Blue" onClick="Move(0,0,2000,0)">Blue</BUTTON><br> | | <button value="Yello" onClick="Move(0,0,2000,2000)">Yello</BUTTON><br> | | <center><font size="72">Area_Red</font></center> | | </div> | | <div style="position: absolute; width: 500px; height: 500px; z-index: 1; left: 2000px; top: 0px; background: blue" id="layer2"> | | <button onClick="Move(2000,0,0,0)">Red</BUTTON><br> | | <button onClick="Move(2000,0,0,2000)">Green</BUTTON><br> | | <button onClick="Move(2000,0,2000,2000)">Yello</BUTTON><br> | | <center><font size="72">Area_Blue</font></center> | | </div> | | <div style="position: absolute; width: 500px; height: 500px; z-index: 1; left: 0px; top: 2000px; background: green" id="layer1"> | | <button onClick="Move(0,2000,0,0)">Red</BUTTON><br> | | <button onClick="Move(0,2000,2000,0)">Blue</BUTTON><br> | | <button onClick="Move(0,2000,2000,2000)">Yello</BUTTON><br> | | <center><font size="72">Area_Green</font></center> | | </div> | | <div style="position: absolute; width: 500px; height: 500px; z-index: 1; left: 2000px; top: 2000px; background: yellow" id="layer1"> | | <button value="Red" onClick="Move(2000,2000,0,0)">Red</BUTTON><br> | | <button value="Green" onClick="Move(2000,2000,0,2000)">Green</BUTTON><br> | | <button value="Blue" onClick="Move(2000,2000,2000,0)">Blue</BUTTON><br> | | <center><font size="72">Area_Yello</font></center> | | </div> | | </body>COPY |
| 
发表于 2014-8-17 17:21
|