CODEWITHSUNDEEP
javascripthtmlcss
owl
owl

Reputation: 4461

Overlay image over image in javascript

How to add click event to small icon with class 'img'? Also if I move cursor to img element, it will be flashing. How to fix it?

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/

Thanks in advance.

Upvotes: 0

Views: 1414

Answers (1)

gorpacrate
gorpacrate

Reputation: 5561

If you don't need to add inner element into DOM every time, do it via css :hover here is fiddle.

Usually you really don't need to. DOM modification is expensive operation.

Upvotes: 4

Related Questions