Posted on 2006-08-05 14:48
兵臨城下 閱讀(769)
評論(7) 編輯 收藏 所屬分類:
JavaScript
?????????最近想實現一個圖片的漸顯漸無的JS程序,就是鼠標移到上面圖片逐漸清晰,鼠標移走圖片逐漸消失。有點問題向大家請教。
?????????相關代碼如下:
????????圖片代碼:?<img src="liuting.jpg" width="339" height="450" onmouseover="high(this)" onmouseout="low(this)" style="FILTER: alpha(opacity=15)"/>
?????????JS方法:
?????????function high(imgHigh){
??????????????high = imgHigh;
??????????????if(typeof(lowlighting) != "undefined") clearInterval(lowlighting);
??????????????highlighting=setInterval("highlightit(high)",100);
?????????}
?????????function low(imgLow){
???????????????low=imgLow;
???????????????clearInterval(highlighting);
????????????????lowlighting = setInterval("lowLight(low)",100);
?????????}
?????????function highlightit(img){
?????????????if(img.filters.alpha.opacity < 200) {
??????????????img.filters.alpha.opacity += 5;
?????????????}
?????????????//else if (window.highlighting)
??????????????//clearInterval(highlighting);
?????????}
?????????function lowLight(img) {
?????????????if(img.filters.alpha.opacity > 15)
????????????????????img.filters.alpha.opacity -= 5;
?????????????//else if (window.lowlighting)
??????????????//clearInterval(lowlighting);
?????????}
?????????網頁打開后,第一次鼠標移上去漸清晰,移走后也正常逐漸消失,都很正常。可當我再次把鼠標移到圖片上時,就沒有反應了,在移出圖片時JS報錯,說在<img />那行,對象不支持此屬性或方法。
????????調了好久也沒成功,特來向大家請教!