html - Javascript return id of the element that triggert the event -


i have range of divs (projects) have display:none-ed overlay container inside of them, containing additional info.
if mouse enters outer div, overlay container should recieve class making visible. on mouse leaving class should removed.
solved using onmouseover="setactive('div id')", made code pretty messed tried switch eventlisteners. won't work though , can't figure out why. script far:

// init eventlisteners each container          window.addeventlistener("load", start, false);         function start() {             var project_containers = document.getelementsbyclassname('content-project')             (var = 0; < project_containers.length; i++) {                 project_containers[i].addeventlistener("mouseover", setactive(), false)                 project_containers[i].addeventlistener("mouseout", setinactive(), false)             }         }    // if mouse on container, add overlay_active class          function setactive() {             var container = document.getelementbyid(event.currenttarget);             var overlay_class = container.getelementsbyclassname("element-overlay")[0];             if (!(overlay_class.classname.match(/(?:^|\s)overlay_active(?!\s)/))) {                 overlay_class.classname += " overlay_active";             }         }    // if mouse outside container again, remove overlay_active class          function setinactive() {             var container = document.getelementbyid(event.currenttarget);             var overlay_class= container.getelementsbyclassname("element-overlay")[0];             if (overlay_class.classname.match(/(?:^|\s)overlay_active(?!\s)/)) {                 overlay_class.classname = overlay_class.classname.replace(/(?:^|\s)overlay_active(?!\s)/g, '')             }         } 

you don't need id set container, functions this:

function setinactive(e) {     var container = e.currenttarget;         //your code     } } 

and call:

project_containers[i].addeventlistener("mouseout", setinactive, false); 

Comments

Popular posts from this blog

html - Sizing a high-res image (~8MB) to display entirely in a small div (circular, diameter 100px) -

java - IntelliJ - No such instance method -

identifier - Is it possible for an html5 document to have two ids? -