欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

用CSS控制的閃爍效果

 更新時(shí)間:2006年09月25日 00:00:00   作者:  

  一段文本或一張圖片,它的周?chē)幸蝗鈺?,這圈光暈每一秒鐘閃爍一次,而當(dāng)鼠標(biāo)移到上面時(shí),立即停止閃爍,當(dāng)鼠標(biāo)移開(kāi)時(shí)又繼續(xù)閃爍。這種效果用于那些需要特別引起別人注意的內(nèi)容上(如:警示、報(bào)告新增內(nèi)容等),能起到較好的效果。

  上面這個(gè)示例就能實(shí)現(xiàn)上面所的效果,由于這里是抓取的一張圖片,不能看到動(dòng)態(tài)效果,只要按下面介紹的方法,制作一個(gè)試試,其效果是一目了然的。其制作思路是:采用了CSS的“Glow”濾鏡產(chǎn)生光暈效果,利用CSS的屬性可動(dòng)態(tài)改變的特性,用一小段javascript程序來(lái)每一秒鐘改變一次屬性值,從而實(shí)現(xiàn)閃爍的效果,再用兩個(gè)事件(onmouseover和onmouseout)調(diào)用Javascript程序來(lái)控制是否閃爍。

  制作方法:

  1、制作一個(gè)Glow濾鏡,CSS濾鏡的設(shè)置方法請(qǐng)參看“CSS濾鏡應(yīng)用技巧”的有關(guān)文章。在此不再重復(fù)。不是使用Dreamweaver的網(wǎng)友,請(qǐng)把下面的代碼復(fù)制到網(wǎng)頁(yè)源代碼的〈head〉與〈/head〉之間:

  〈style type="text/css"〉

  〈!--

  .glow1 { filter:glow(color=#FF0000,strengh=2)}

  --〉

  〈/style〉

  2、插入一個(gè)圖層,取名為:bob。在圖層上寫(xiě)上一段文字。再在圖層上加載一個(gè)Glow濾鏡,并加上兩個(gè)事件以實(shí)現(xiàn)當(dāng)鼠標(biāo)移到文字上時(shí)強(qiáng)制停止閃爍,當(dāng)鼠標(biāo)移開(kāi)文字時(shí)繼續(xù)閃爍。代碼:onclick="stopflash(this)",這句代碼的作用是:一旦鼠標(biāo)移到文字上,將調(diào)用程序的“stopflash(this)”函數(shù)來(lái)停止閃爍; onmouseout="init()",這句代碼的作用是:一旦鼠標(biāo)移開(kāi)文字,將調(diào)用程序的“init()”函數(shù)來(lái)使光暈閃爍。本例完成后圖層標(biāo)記的代碼是這樣的:

  〈div id="bob" style="position:absolute; width:572px; height:35px; z-index:1" class="glow1" onmouseover="stopflash(this)" onmouseout="init()"〉

  3、在〈head〉與〈/head〉之間插入這樣一段Javascript程序:

  〈script 〉

  〈!--

  function init() // 光暈開(kāi)始閃爍

  {

  makeflash(bob);

  }

  function makeflash(obj)

  {

  obj.flashTimer=setInterval("bob.filters.glow.enabled= !bob.filters.glow.enabled",1000)

  } // 這里的“1000”是閃爍的時(shí)間,以毫秒計(jì),在本例中是設(shè)置了1000毫秒(即1秒),可以根據(jù)需要修改。

  function stopflash(obj) // 光暈停止閃爍

  { clearInterval(obj.flashTimer)

  }

  //--〉

  〈/script〉
  4、在網(wǎng)頁(yè)源代碼的〈body〉標(biāo)記中加上這樣一段代碼:onload="init()"。這句代碼的作用是當(dāng)網(wǎng)頁(yè)載入時(shí),光暈開(kāi)始閃爍。

  至此,制作結(jié)束,按F12就可看到預(yù)期的效果了。

  光暈的顏色和光暈的長(zhǎng)度均可修改CSS濾鏡中的參數(shù)值來(lái)改變,光暈閃爍的時(shí)間間隔可通過(guò)修改Javascript中的間隔時(shí)間值來(lái)調(diào)整。若是在圖層中插入圖片(透明背景的gif圖片效果更好),則變?yōu)閳D片邊緣的光暈閃爍效果。

 

相關(guān)文章

最新評(píng)論