gpt4 book ai didi

javascript - 显示/隐藏和鼠标悬停 Javascript

转载 作者:行者123 更新时间:2023-11-28 18:40:52 25 4
gpt4 key购买 nike

我一直在研究显示/隐藏 javascript 并通过鼠标悬停效果进一步插入它以实现我想要的。我已经设置了一个 fiddle 以获得更好的可访问性。但是,我现在想通过最多 4 个不同的文本区域(“单击此处了解更多信息”)来插入它,并且每个文本区域都会有更多的悬停文本,因为我试图在 HTML 代码本身中显示。我使用和编辑的 javascript 现在具有对应于“0”和“1”的“ID”,这不适用于我当前的 HTML 代码,因为它具有时髦的名称,如“uu3308-10”(由 Adob​​e Muse 制作)。 现在,我想知道我必须在 Javascript 中更改哪些变量才能使其正常运行,是否有一种方法可以编译此代码,使其与至少 11 个其他代码一起使用“单击此处获取更多信息信息”点?

注意:当前的 javascript 使 showMoreText2 出现在两个 showMoreText 区域下方(希望一次只出现一个悬停文本)。

单击此处获取 fiddle --> http://jsfiddle.net/TPLOR/vy6nS/

谢谢,我希望这对您有所帮助。 =)

最佳答案

有点骇人听闻:(参见 http://jsfiddle.net/vy6nS/30/)

window.onload = function() {
var elems1 = document.getElementsByClassName("expander");
for (i = 0; i < elems1.length; i++) {
elems2 = elems1[i].childNodes;
for (x = 0; x < elems2.length; x++) {
if (elems2[x].className == "toggle") elems2[x].onclick = function() {
showMore(0, this);
};
else if (elems2[x].className == "showMoreText") {
elems2[x].onmouseover = function() {
showChilds("block", this);
};
elems2[x].onmouseout = function() {
showChilds("none", this);
};
}
}
}
};

function get_nextsibling(n) {
x = n.nextSibling;
while (x.nodeType != 1) {
x = x.nextSibling;
}
return x;
}

function showChilds(disp, elem) {
get_nextsibling(elem).style.display = disp;
}

function showMore(disp, elem) {
var children = elem.parentNode.childNodes;
for (i = 0; i < children.length; i++) {
if (disp == 0 && children[i].className == "showMoreText") {
children[i].style.display = children[i].style.display == "none" ? "block" : "none";
}
}

}​

关于javascript - 显示/隐藏和鼠标悬停 Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11457653/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com