导航下拉菜单出现圆角问题

发布于 2024-10-10 11:55:32 字数 270 浏览 6 评论 0原文

我已经在此处看到了以下导航下拉菜单。

它可以工作并且几乎完成,但我有一个问题。当您将鼠标悬停在导航标题上时,文本会从彩色变为黑色,然后显示下拉列表。这就是它应该如何工作,但是当您移动鼠标进入下拉列表中的导航标题时,黑色文本(活动图像)将恢复为彩色并且不会保持黑色。

当下拉菜单处于活动状态并且用户正在浏览此类菜单以使文本(活动图像)保持黑色时,有什么建议吗?

I have worked on the following nav drop down seen here.

It works and is almost complete, but I have one issue. When you mouseover a nav title the text goes from color to black and then shows the dropdown. That is how it should work, but when you move your mouse to go a nav title within the dropdown the black text(active image) goes back to color and doesnt remain black.

Any suggestion when dropdown is active and user is navigating through such to keep the text(active image) black?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

风吹短裙飘 2024-10-17 11:55:32

理想情况下,您将使用文本而不是图像作为菜单项。然后,您可以非常轻松地使用 CSS 来控制将鼠标悬停在

  • 上时的文本颜色,而根本不需要 JavaScript。
  • 按照您现在的方式(使用图像),我相信通过将 onmouseover 和 onmouseout 从 移动到

  • 仍然是可能的> 上面。它可能需要对脚本进行一些调整才能工作,但希望您了解这个概念:检测将鼠标悬停在整个列表项(及其内容)上,而不是仅在该列表项中的锚标记上。
  • Ideally, you would be using text rather than images for the menu items. Then, you could very easily use CSS to control the text colors on hover over the <li> without any need for JavaScript at all.

    With the way you're doing it now (with images), I believe it's still possible by moving your onmouseover and onmouseout from the <a> to the <li> above it. It may require some tweaking of the scripts for this to work, but hopefully you get the concept: detect hovering over the entire list item (and its contents) rather than on just the anchor tag within that list item.

    沩ん囻菔务 2024-10-17 11:55:32

    如何将菜单项及其下拉列表放入一个展开以包含下拉菜单的容器(可能是 div)中,然后使用包含 :hover 的 CSS 选择器在该容器上,深入到项目文本。只要它们仍在菜单或其下拉菜单上,它就应该仍然被悬停选择器覆盖。

    How about putting the menu item, along with its drop down in a container (div probably) that expands to include the dropdown menu, and then use a CSS selector including :hover on that container, that drills down to the item text. As long as they are still on the menu or its dropdown, it should still be covered by the hover selector.

    痴意少年 2024-10-17 11:55:32

    当鼠标悬停在

  • 上时,您可以使用 CSS 或 JS 更改标题的颜色。包含标题而不是悬停标题本身时。
  • You can use CSS ot JS to change the title's color when the mouse hovers the <li> that contains the title instead of when it hovers the title itself.

    ~没有更多了~
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文