首頁 > web前端 > html教學 > 網頁常用特效整理:進階篇

網頁常用特效整理:進階篇

黄舟
發布: 2016-12-23 14:54:46
原創
1362 人瀏覽過


筆者日積月累了許多精彩、實用的Web特效的製作,這些特效幾乎都是比較常用的網頁特效。現在我就把這些經過整理和修改過的特效分三個等級分別介紹給大家。

  高級篇

  1.不同時段顯示不同問候語

  <Script Language="JavaScript">
  <!--
  var text="";   day = new Date(); =0) && (time < 7 ))
    text="夜貓子,要注意身體哦!"
  if (( time >= 7 ) && (time < 12))
  那個朋友呢? "
  if (( time >= 12) && (time < 14))
    text="午休時間。 )
    text="祝您下午工作愉快!"
  if ((time >= 18) && (time <= 22))
    text="您又來了,可((time >= 22) && (time < 24))
    text="您應該休息了!"
  document.write(text)
  ///----.〜〜〜水中倒影效果

  <img id="reflect" src="../../你自己的圖片文件名" width="175" height="59"> 
  <script language="JavaScript">
  function f1()
  {
    setInterval("mp.filters.wave.phase+=10",100); 
  }
  if(docum <img  id=mp  src="'+與。 }
  </script>

  3.慢慢變大的視窗

  <Script Language="JavaScript">
  <!--
  var Windowsheight=100
  varwpidth=1007]100『 ){
  temploc=thelocation
  if 
(!(window.resizeTo&&document.all)&&!(window.resizeTo&&document.getElementById))
  {
    window.open(thelocation)
    window.open(thelocation)
  〜 〜〜 〜 〜 〜 〜 〜〜 〜、〜、、〜、、〜、、〜、〦〦〦〦〦​​ .open("","","scrollbars")
windowsize.moveTo(0,0)
  windowsize.resizeTo(100,100)
  tenumxt()
  }
  function s
  } .    numx=0
  windowsize.resizeBy(5, numx)
  Windowsheight+=5
  Windowswidth+=5
  if (Windowswidth>=screen.width-5)
  {
    windowsize.location=temploc
    Windowsheight=100
    Windowswidth=100
    numx=5
    return
  }
  setTimeout(" tenumxt()",50)
  }
  //-->
  </script>
  <p><a href="scriptscript:
[ a>

  4.改變IE網址列的IE圖示

  我們要先做一個16*16的icon(圖示檔),儲存為index.ico。把這個圖示檔案上傳到根目錄下並在首頁<head></head>之間加上如下碼:

  <link REL = "Shortcut Icon" href="index.ico">

    讓網頁隨意後退

  <a href="javascript:history.go(-X)">X</a> //把X換成你想要後退在頁數
 㠀   +」就為前進

  6.滑鼠指向時彈出訊息框

  在<body></body>之間加上如下程式碼:

  <a href onmouseover="alert('彈出資訊!')">顯示的連結文字<>
  7.點選滑鼠右鍵彈出新增收藏夾對話框

  在<body></body>之間加上如下程式碼:

  <Script Language=JavaScript>
 腳 》》. Function("if (event.button==2||event.button==3) 
  window.external.addFavorite('您的網址','您的網站名稱)")
  </Script>
〜『〜〜8.隨機變換背景圖象(一個可以刷新心情的特效)

  在<head></head>之間加上如下碼:

  <Script Language=" /定義image為圖片數量的陣列
image [0] = 'tu0.gif'     //背景圖像的路徑
  image [1] = 'tu1.gif'
  image [2] = 'tu2.gif'
   image [2] = 'tu2.gif'gif
  image [3] = 'gif'
  image [4] = 'tu4.gif'
  number = Math.floor(Math.random() * image.length);
  document.write("<BODY BACKGACKGliage[ROnumber" ;
  </Script>

  9.滑鼠一碰就給顏色看的連結

  在<body></body>之間加上如下碼:

  <p onMouseMove="anniu()">你敢碰我,我就給點你看! </p>
  <Script Language = "VBScript">
  sub anniu
  document.fgColor=int(256*256*256*rr〟〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〟㜀〜〜
  10.從天而降並有幻影效果的視窗

  <head>
  <Script language="JavaScript">
  function move(x) {🀜 〜。.
  for( i = x; i > 0; i--)
  {
  self.moveBy(0,3);
  }
 for(j = 200; j > 0; j--){ 如果你認為你認為動眼,就200換成位數
  self.moveBy(0,j);
  self.moveBy(j,0);
  self.moveBy(0,-j);
  self.moveBy(0,-j3);
 
  }
  }
  }
  </Scrip>
  <body bgColor=#ffffffff onload=m  <body bgColor=#ffffffff onload=mffff(280)〟 >

  11.表格的半透明顯示器</style>

  在<body></body>之間加上如下碼:
  <table border="1" width="100" height="62"  class="alpha24gcolorclass="alpha2464" >
  <tr>
  <td width="100%" height="62">
  <p align="center">很酷>
  </ table>

 以上就是網頁常用特效整理:高級篇的內容,更多相關內容請關注PHP中文網(www.php.cn)!


   

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板