javascript中的圖像覆蓋圖像

如何將點擊事件添加到類'img'的小圖標？如果我將光標移動到img元素，它也會閃爍。如何解決它？javascript中的圖像覆蓋圖像

document.getElementsByTagName('img')[0].addEventListener('mouseover', function(e) { 
    var element = document.createElement('div'); 
    element.setAttribute('class', 'img'); 
    this.parentNode.appendChild(element); 
}); 
document.getElementsByTagName('img')[0].addEventListener('mouseout', function(e) { 
    this.parentNode.removeChild(this.parentNode.getElementsByClassName('img')[0]); 
});

的jsfiddle：http://jsfiddle.net/MS8F9/

在此先感謝。

來源

2014-07-02 owl

你使用jQuery嗎？ – spongebob

@Moosh，vanilla.js，但我認爲沒關係。如果您知道如何使用jQuery，請顯示您的版本。 – owl

@owl：你爲什麼不使用古老的純CSS'？這些日子會更好。您也可以非常輕鬆地應用動畫（例如淡入淡出）。使用JavaScript進行懸停效果就像使用大錘打破螺母一樣...... –

如果您不需要每次將內部元素添加到DOM中，請通過css :hover這裏是fiddle。

通常你真的不需要。 DOM修改是昂貴的操作。

來源

2014-07-02 14:09:25 gorpacrate

+1這將是更好的方法。 –

不錯。謝謝。但我對使用javascript的另一個版本感興趣。我不明白如何使用js .. – owl

問題是 - 當您將鼠標懸停在內部項目上時，會自動彈出外部項目。在瀏覽器控制檯中檢查[this one]（http://jsfiddle.net/MS8F9/3/）。處理這件事相當棘手。 – gorpacrate

javascript中的圖像覆蓋圖像

回答

相關問題