亚洲精品亚洲人成在线观看麻豆,在线欧美视频一区,亚洲国产精品一区二区动图,色综合久久丁香婷婷

              當前位置:首頁 > IT技術 > 移動平臺 > 正文

              方框移動
              2021-08-10 11:25:33

              <HEAD>
              <TITLE>方框移動</TITLE>
              <meta http-equiv="Content-Type" content="text/html; charset=GBK">
              <style language="javascript">
              <!--
              body, td{
              ?font-size: 9pt;
              }
              .hidden{display:none;}
              .show{display:block;}
              -->
              </style>
              </HEAD>
              <BODY>
              <SCRIPT LANGUAGE="JavaScript">
              <!--
              var speed=10;//速度
              var ci = 10;//運動次數
              var left=0;//方框左位置
              var top=0;//方框上位置
              var width=0;//方框寬
              var height=0;//方框高
              var aimleft=0;//目標左位置
              var aimtop=0;//目標上位置
              var aimwidth=0;//目標寬
              var aimheight=0;//目標高
              var lb=0;//左步長
              var tb=0;//上步長
              var wb=0;//寬步長
              var hb=0;//高步長
              var fk = null;
              var aim = null;
              var aim1 = null;
              function initObj(oid){
              ?if (!fk){fk = document.getElementById('fk');}
              ?if (!aim){aim = document.getElementById('aim');}
              ?if (!aim1)aim1 = document.getElementById('aim1');
              //?while (fk.hasChildNodes())fk.removeChild(fk.firstChild);
              ?if (oid)
              ??append(fk,document.getElementById(oid),true);
              }
              function append(o,oc,cloned){
              ?while (o.hasChildNodes())o.removeChild(o.firstChild);
              ?if (cloned)oc = oc.cloneNode(true);
              ?oc.className = 'show';
              ?o.appendChild(oc);
              }
              /*
              * 取得對象位置、大小
              * 取得目標對象位置、大小
              */
              function setSource(obj,oid){
              ?initObj(oid);
              ?left????? = getOffset(obj).Left;
              ?top?????? = getOffset(obj).Top;
              ?width???? = obj.offsetWidth;
              ?height??? = obj.offsetHeight;
              ?aimleft?? = getOffset(aim).Left;
              ?aimtop??? = getOffset(aim).Top;
              ?aimwidth? = aim.offsetWidth;
              ?aimheight = aim.offsetHeight;
              ?fk.style.display='';
              ?clearInterval(MyMar);
              }
              /**
              * 設置方向步長、寬高步長
              */
              function setStep(){
              ?lb = (aimleft-left)/ci;
              ?tb = (aimtop-top)/ci;
              ?wb = (aimwidth-width)/ci;
              ?hb = (aimheight-height)/ci;
              }
              /**
              * 移動
              */
              function move(){
              ?setStep();
              ?left+=lb;
              ?top+=tb;
              ?width+=wb;
              ?height+=hb;
              ?if(left<aimleft-2 || top<aimtop-2 || width<aimwidth-2 || height<aimheight-2){
              ??fk.style.left = left+"px";
              ??fk.style.top = top+"px";
              ??fk.style.width = width+"px";
              ??fk.style.height = height+"px";
              ?}else{
              ??if (fk)
              ???while(fk.hasChildNodes()){append(aim1,fk.firstChild);}
              ??hiddenFK();
              ??clearInterval(MyMar)
              ?}
              }
              function hiddenFK(){
              ?initObj();
              ?fk.style.display='none';
              }
              /**
              * 取得某元素在頁面中相對頁面左上頂點的位置
              */
              function getOffset(obj){
              ?var offsetleft = obj.offsetLeft;
              ?var offsettop = obj.offsetTop;
              ?while (obj.offsetParent != document.body)
              ?{
              ??obj = obj.offsetParent;
              ??offsetleft += obj.offsetLeft;
              ??offsettop += obj.offsetTop;
              ?}
              ?return {Left : offsetleft, Top : offsettop};
              }
              var MyMar=setInterval(move,speed);
              //-->
              </SCRIPT>
              <div id="fk" style="position: absolute; width: 46px; height: 20px; border: 1px solid #000000 ; display: none"></div>
              <TABLE style="border: 1px solid #666666" cellspacing=1 bgcolor=#ff1111 cellpadding=4 border=0>
              <TR bgcolor=#ffffff>
              ?<TD onClick="setSource(this,'t1');MyMar=setInterval(move,speed)">筆記本</TD>
              ?<TD onClick="setSource(this,'t2');{MyMar=setInterval(move,speed)}">小家電</TD>
              ?<TD onClick="setSource(this,'t3');{MyMar=setInterval(move,speed)}">電冰箱</TD>
              ?<TD onClick="setSource(this,'t4');{MyMar=setInterval(move,speed)}">波比娃娃</TD>
              ?<TD onClick="setSource(this,'t5');{MyMar=setInterval(move,speed)}">小家電</TD>
              ?<TD onClick="setSource(this,'t6');{MyMar=setInterval(move,speed)}">小家電</TD>
              </TR>
              </TABLE>
              <br><br>
              <br><br>
              <br><br>
              <TABLE id="aim" style="border: 1px solid #666666 ; width: 227px; height: 300px;">
              <TR>
              ?<TD id='aim1' valign="top"></TD>
              </TR>
              </TABLE>
              <br>
              <br>
              <br>
              <br>
              <TABLE style="border: 1px solid #666666" cellspacing=1 bgcolor=#ff1111 cellpadding=4 border=0>
              <TR bgcolor=#ffffff>
              ?<TD onClick="setSource(this,'t1');MyMar=setInterval(move,speed)">筆記本</TD>
              ?<TD onClick="setSource(this,'t2');{MyMar=setInterval(move,speed)}">小家電</TD>
              ?<TD onClick="setSource(this,'t3');{MyMar=setInterval(move,speed)}">電冰箱</TD>
              ?<TD onClick="setSource(this,'t4');{MyMar=setInterval(move,speed)}">波比娃娃</TD>
              ?<TD onClick="setSource(this,'t5');{MyMar=setInterval(move,speed)}">小家電</TD>
              ?<TD onClick="setSource(this,'t6');{MyMar=setInterval(move,speed)}">小家電</TD>
              </TR>
              </TABLE>
              <div id="t1" class="hidden">第1個div</div>
              <div id="t2" class="hidden">第2個div</div>
              <div id="t3" class="hidden">第3個div</div>
              <div id="t4" class="hidden">第4個div</div>
              <div id="t5" class="hidden">第5個div</div>
              <div id="t6" class="hidden">第6個div</div>
              </BODY>

              ?
              ?
              ?
              ?

              本文摘自 :https://blog.51cto.com/u

              開通會員,享受整站包年服務立即開通 >