<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>鼠標(biāo)滑過(guò) 圖片震動(dòng)效果</title>

<STYLE>.shakeimage {

 POSITION: relative

}

</STYLE>

</head>

<body>

<SCRIPT language=JavaScript1.2>

<!--

var rector=3

var stopit=0

var a=1

function init(which){

stopit=0

shake=which

shake.style.left=0

shake.style.top=0

}

function rattleimage(){

if ((!document.all&&!document.getElementById)||stopit==1)

return

if (a==1){

shake.style.top=parseInt(shake.style.top)+rector

}

else if (a==2){

shake.style.left=parseInt(shake.style.left)+rector

}

else if (a==3){

shake.style.top=parseInt(shake.style.top)-rector

}

else{

shake.style.left=parseInt(shake.style.left)-rector

}

if (a<4)

a++

else

a=1

setTimeout("rattleimage()",50)

}

function stoprattle(which){

stopit=1

which.style.left=0

which.style.top=0

}

//-->

</SCRIPT>

<img class="shakeimage" onMouseOver="init(this);rattleimage()" onMouseOut="stoprattle(this)" src="/images/csrcode.ico" border="0" style="cursor:pointer;"/>

<img class="shakeimage" onmouseover="init(this);rattleimage()" onmouseout="stoprattle(this)" src="/images/changshi.ico"  border="0" style="cursor:pointer;"/>

<img class="shakeimage" onmouseover="init(this);rattleimage()" onmouseout="stoprattle(this)" src="/images/links.ico" border="0" style="cursor:pointer;"/>

鼠標(biāo)滑過(guò)圖片預(yù)覽效果。

</body>

</html>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

微信小程序之頁(yè)面攔截器的示例代碼
本篇文章主要介紹了微信小程序之頁(yè)面攔截器的示例代碼，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
javascript實(shí)現(xiàn)點(diǎn)擊按鈕讓DIV層彈性移動(dòng)的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)點(diǎn)擊按鈕讓DIV層彈性移動(dòng)的方法,實(shí)例分析了javascript操作div層的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-02-02
JavaScript類繼承及實(shí)例化的方法
這篇文章主要介紹了JavaScript類繼承及實(shí)例化的方法,較為詳細(xì)的分析了javascript擴(kuò)展類、實(shí)例化類及類對(duì)象與成員函數(shù)的使用技巧,需要的朋友可以參考下
2015-07-07
深入學(xué)習(xí) JavaScript中的函數(shù)調(diào)用
可能很多人在學(xué)習(xí) JavaScript 過(guò)程中碰到過(guò)函數(shù)參數(shù)傳遞方式的迷惑，本著深入的精神，我給大家分享了一篇教程關(guān)于javascript中的函數(shù)調(diào)用知識(shí)，感興趣的朋友一起學(xué)習(xí)吧
2017-03-03
判斷JavaScript對(duì)象是否可用的最正確方法分析
在調(diào)試JavaScript的過(guò)程中，你是不是經(jīng)常會(huì)遇到object undefined的問(wèn)題呢？你平時(shí)是怎樣來(lái)測(cè)試對(duì)象是否存在呢？判斷瀏覽器版本？判斷JavaScript版本？本文來(lái)告訴你正確的方法。這篇文章涉及的瀏覽器可能古老一些，但是闡述的道理確實(shí)適合現(xiàn)在使用的。
2008-10-10
jQuery Mobile動(dòng)態(tài)刷新頁(yè)面樣式的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇jQuery Mobile動(dòng)態(tài)刷新頁(yè)面樣式的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-05-05
javascript靜態(tài)頁(yè)面?zhèn)髦档娜N方法分享
這篇文章介紹了javascript靜態(tài)頁(yè)面?zhèn)髦档娜N方法及優(yōu)缺點(diǎn)，有需要的朋友可以參考一下
2013-11-11
靜態(tài)頁(yè)面實(shí)現(xiàn) include 引入公用代碼的示例
下面小編就為大家?guī)?lái)一篇靜態(tài)頁(yè)面實(shí)現(xiàn) include 引入公用代碼的示例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
用js調(diào)用迅雷下載代碼的二種方法
用js調(diào)用迅雷下載代碼的二種方法，需要的朋友可以參考一下
2013-04-04
簡(jiǎn)單純js實(shí)現(xiàn)點(diǎn)擊切換TAB標(biāo)簽實(shí)例
選項(xiàng)卡效果代碼，無(wú)jq,JS來(lái)實(shí)現(xiàn)，灰色風(fēng)格，沒(méi)有怎么美化，或許看上去比較普通，不過(guò)兼容性和操作起來(lái)挺舒服的，風(fēng)格適用于大部分的網(wǎng)站，或許你會(huì)用得上。
2015-08-08