css - Nivo slider css 下拉菜单冲突

标签 css menu slider nivo-slider

我正在尝试向其中添加 nivo slider 的网站上工作。我遇到的问题是 slider 覆盖了 css 下拉菜单,我没有在菜单中看到方向箭头。

当我将 z-index:-50 添加到 nivo-slider.css 文件中的 .nivoSlider 行时,菜单正常工作,没有隐藏在 slider 后面,但我仍然没有导航箭头,并且现在实际 slider (​​左或右)内的导航箭头可见但不起作用。

查看这些问题的链接是here .

任何建议的帮助将不胜感激。 谢谢,乔

最佳答案

好的,首先从.nivoSlider中移除z-index。第二个也是最重要的部分 - 你在菜单中有这样的结构:

<ul id="nav-one" class="dropmenu css-only">
<li><a style="border-left:1px solid #CCCCCC; padding-left:23px; padding-right:23px;" href="index.php">Home</a></li>

<li><a href="company.php">Company</a>
    <ul class="SomeNewClass">
    <li><a href="history.php">History</a></li>
    <li><a href="markets.php">Markets</a></li>
    <li><a href="news.php">News</a></li>
    <li><a href="licensee-advisory-board.php">Licensee Advisory Board</a></li>
    <li><a href="copyright-notice.php">Copyright Notice</a></li>
    </ul>
    </li>
<li><a href="branding.php">Branding</a>
    <ul class="SomeNewClass">
    <li><a href="graphics.php">Graphics</a></li>
    <li><a href="signs.php">Signs</a></li>
    <li><a href="paint.php">Paint</a></li>
    <li><a href="dispenser-doorSkins.php">Dispenser DoorSkins</a></li>
    <li><a href="dispenser-overlays.php">Dispenser Overlays</a></li>
    <li><a href="image-manual.php">Image Manual</a></li>
    <li><a href="image-evaluation-form.php">Image Evaluation Form</a></li>
    </ul>
</li>
<li><a href="payments-processing.php">Payments Processing</a>
    <ul class="SomeNewClass">
    <li><a href="fleet-card.php">Fleet Card</a></li>
    <li><a href="echoSat.php">EchoSat</a></li>
    <li><a href="PCI-compliance.php">PCI Compliance</a></li>
    <li><a href="transnational.php">TransNational</a></li>
    </ul>
</li>
....
....
....

如您所见,我添加了名为 .SomeNewClass 的类。将此类放在所有位置,就像我在示例中向您展示的那样,然后将其放入您的 CSS

.SomeNewClass
{
    z-index: 99999;
}

关于css - Nivo slider css 下拉菜单冲突,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11770703/

相关文章:

c# - ASP.Net MVC : How can I easily change the tab color of my navigation menu based on the tab that I'm on?

jQuery Slidertron 链接到幻灯片

javascript - jQuery 完成事件

css - 如何在 CSS 中设置背景图片大小?

html - 在页面另存为时包含@font-face

javascript - 如何为第一个和最后一个项目应用非事件类

reactjs - Swiper Slider Effect 在 React Js 中不起作用

asp.net - 为什么 CssClass 不能正常工作,而普通类(class)可以?

php - 如何在 WordPress 中使用 wp_get_nav_menu_items 生成自定义菜单/子菜单系统?

javascript - 菜单 mouseenter mouseleave click