隨筆 - 44  文章 - 78  trackbacks - 0
          <2009年6月>
          31123456
          78910111213
          14151617181920
          21222324252627
          2829301234
          567891011

           Happy 牛 Year
          一、一周至少寫(xiě)一篇博文;
          二、每天至少學(xué)習(xí)半個(gè)小時(shí)。
          三、奔向小牛!

          常用鏈接

          留言簿(6)

          我參與的團(tuán)隊(duì)

          隨筆分類(lèi)

          隨筆檔案

          文章檔案

          搜索

          •  

          最新評(píng)論

          閱讀排行榜

          評(píng)論排行榜

          如有使用該頁(yè)面中非js腳本源代碼的內(nèi)容,請(qǐng)注明出處 by Tiger1102

          最近網(wǎng)上流傳著一種將當(dāng)前頁(yè)面中的圖片位置進(jìn)行變換的代碼,感覺(jué)比較好玩,就想簡(jiǎn)單了解一下,大家如果感興趣可以一起探討,呵呵。
          注:網(wǎng)上粘貼的代碼是整個(gè)都未換行的,為了看著方便,我做了
          格式處理,不過(guò)經(jīng)過(guò)處理后的粘到地址欄里可能顯示效果有問(wèn)題
          ,最后我會(huì)給出網(wǎng)上流傳的格式。
          //首先聲明是javascript腳本
          //然后定義各個(gè)變量,注意在下面的使用中除R變量一直變化外,其它都是固定不變的
          javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6;
          y3=.24; x4=300; y4=200; x5=300; y5=200;
          //獲取當(dāng)前頁(yè)面所有的圖片元素
          DI=document.images;
          //獲取圖片元素個(gè)數(shù)
          DIL=DI.length;
          //定義函數(shù),功能是循環(huán)獲取每個(gè)圖片元素樣式,將圖片位置進(jìn)行改變
          function A(){
          //注意這里的i-DIL,等同于i-DIL<0,如果起初i-DIL>0的話,這里就等同于i-DIL>0,網(wǎng)上找資料未果,就自己猜測(cè)并驗(yàn)證了一下,如果誰(shuí)知道的話可以和小弟說(shuō)一下
          ?? for(i=0; i-DIL; i++){
          //根據(jù)下標(biāo)獲取每個(gè)圖片元素樣式
          ????????DIS=DI.style;
          //將圖片對(duì)象從文檔流中拖出,然后使用下面的left、top對(duì)圖片元素進(jìn)行絕對(duì)定位
          ????????DIS.position='absolute';
          //定位圖形距離屏幕左邊的距離
          //每個(gè)圖片顯示位置的不同,是通過(guò)函數(shù)中的i控制的
          //每次A()函數(shù)執(zhí)行完成后,再次執(zhí)行時(shí),圖片會(huì)換位置是通過(guò)R
          的變換來(lái)控制的
          //圖片只所以循環(huán)在固定的幾個(gè)位置上是根據(jù)Math.sin和Math.cos和x1,x2,x3,y1,y2,y3來(lái)計(jì)算的,如果想了解更詳細(xì)可以進(jìn)一步熟悉這兩個(gè)函數(shù)

          ????????DIS.left=Math.sin(R*x1+i*x2+x3)*x4+x5;??????????
          ????????//定位圖形距離屏幕右邊的距離
          DIS.top=Math.cos(R*y1+i*y2+y3)*y4+y5
          ?? }
          ?? R++
          }
          //定義執(zhí)行A()函數(shù)的間隔時(shí)間,單位為毫秒,下面是5毫秒執(zhí)行一次
          setInterval('A()',5);
          //下面的void(0)為了使頁(yè)面不跳轉(zhuǎn),如果去除,則將會(huì)根據(jù)上面的代碼內(nèi)容,轉(zhuǎn)向一個(gè)新的頁(yè)面
          void(0);


          網(wǎng)上流傳的最初代碼,如果沒(méi)有試過(guò)的可以看下效果哈,只要找一個(gè)含有圖片的地址,將下面代碼拷貝到地址欄,回車(chē)就OK了:
          javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.images; DIL=DI.length;function A(){?? for(i=0; i-DIL; i++){????????DIS=DI[ i ].style;???????? DIS.position='absolute';????????DIS.left=Math.sin(R*x1+i*x2+x3)*x4+x5;??DIS.top=Math.cos(R*y1+i*y2+y3)*y4+y5?? }?? R++ } setInterval('A()',5);void(0);
          posted on 2009-05-18 17:22 Tiger1102 閱讀(1704) 評(píng)論(2)  編輯  收藏

          FeedBack:
          # re: 關(guān)于網(wǎng)上流行的圖片飄移代碼的簡(jiǎn)解  2009-06-16 11:05 ni jiejie
          這是你發(fā)現(xiàn)的還是自己寫(xiě)的啊?  回復(fù)  更多評(píng)論
            
          # re: 關(guān)于網(wǎng)上流行的圖片飄移代碼的簡(jiǎn)解  2009-06-22 11:58 ni jiejie
          咋不說(shuō)話,想啥呢?  回復(fù)  更多評(píng)論
            

          只有注冊(cè)用戶(hù)登錄后才能發(fā)表評(píng)論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 新安县| 高邑县| 延吉市| 兴隆县| 永靖县| 福鼎市| 秀山| 社会| 东城区| 泗洪县| 霞浦县| 额尔古纳市| 迭部县| 阿瓦提县| 双鸭山市| 郎溪县| 望奎县| 新民市| 瓦房店市| 乡宁县| 江川县| 汕头市| 驻马店市| 江都市| 巫山县| 樟树市| 三江| 得荣县| 呼玛县| 益阳市| 班玛县| 四子王旗| 民丰县| 和顺县| 梅河口市| 东山县| 明溪县| 福安市| 淄博市| 上杭县| 文成县|