[英]Proper hover effect with Javascript
I need some help with JavaScript.我需要一些 JavaScript 方面的帮助。 I am creating a small display menu, which do have a hover effect.
我正在创建一个小的显示菜单,它确实有悬停效果。 Please check the Live Fiddle.
请检查现场小提琴。 Now I want that when I hover over book , this hover effect shouldn't happen.
现在我希望当我将鼠标悬停在book 上时,这种悬停效果不应该发生。 but when I hover other elements the hover effect will happen.
但是当我悬停其他元素时,悬停效果就会发生。 I mean if I hover on bookstore or book there will be no description box, but when I hover over title / author / year / price the description tag should be displayed.
我的意思是,如果我将鼠标悬停在书店或书籍上,将没有描述框,但是当我将鼠标悬停在标题/作者/年份/价格上时,应该显示描述标签。 All this needs to be done with JavaScript not jQuery.
所有这些都需要使用 JavaScript 而不是 jQuery 来完成。
function traverse(node) {
var ul = document.createElement('ul');
if (typeof node !== 'undefined') {
var li = document.createElement('li');
var desc = document.createTextNode(node.name);
var img = document.createElement("img");
img.src = node.src;
li.appendChild(img)
li.appendChild(desc);
if (node.children.length == 0) {
li.className = "leaf";
}
li.onclick = clickExpand;
li.onmouseover = showDescrip;
li.onmouseout = hideDescrip;
li.onmousemove = moveDescrip;
if (typeof node.children !== 'undefined') {
node.children.forEach(function (child) {
li.appendChild(traverse(child));
});
}
ul.appendChild(li);
}
return ul;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.