gpt4 book ai didi

javascript - 悬停菜单上显示嵌套的 div

转载 作者:行者123 更新时间:2023-11-28 17:04:03 25 4
gpt4 key购买 nike

我创建了一个 JSFiddle,请查看。

fiddle

我无法将 css 定位到嵌套 div 的悬停功能。在代码示例中,我如何让以下目标成为特定的 div

div id=”nav1″ display div id=”section5″

div id=”nav2″ display div id=”section6″

目前,parent div id=”nav” 显示 div id=”section5″

如果有更好的方法,请告诉我。

谢谢

最佳答案

您需要稍微更改您的 HTML 结构,删除父 .nav 以制作 #nav1#nav2 #section5#section6 “ sibling ”。然后使用兄弟 CSS 选择器来定位您想要的内容:

CSS:

#nav1:hover ~ #section5,
#section5:hover {
display: block;
}

#nav2:hover ~ #section6,
#section6:hover {
display: block;
}

fiddle :https://jsfiddle.net/lmgonzalves/9965yanr/6/

编辑:

添加 float.nav 具有的其他属性,并进行一些您可以改进的调整。查看工作演示:https://jsfiddle.net/lmgonzalves/9965yanr/8/

关于javascript - 悬停菜单上显示嵌套的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30671917/

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