css - JavaScript : mouseout event in Popup Bubble causing children to hide -
i have problem event propagation. when mouseover child element in description div, description div mouseovered child gets display:none;. after event occurs selected child remain invisible until page refresh. here "working" demo:
i believe main cause of somewhere between lines 8-15 of js code on jsfiddle themouseout triggers in case of not finding description div under mouse cursor.
i have found not elegant workaround adding :before description div in css. can find workaround commented in jsfiddle css section. unfortunately prevents of doing in popup bubble (like href clicking). want keep simple , functional, without workarounds.
use mouseleave , target instead of e.target. e.target equal hovering.
https://jsfiddle.net/gfvq9yvp/6/
e.target.children[a].addeventlistener("mouseleave",function(e){ this.style.display="none"; }, false);
Comments
Post a Comment