当前位置: 首页 > 知识库问答 >
问题:

尝试将鼠标移到上面时,子菜单将消失

谢奇略
2023-03-14

当我尝试将鼠标移动到下拉子菜单(主下拉菜单)上时,主下拉菜单消失,下一个下拉(如果有下拉项)菜单项显示出来。也许CSS代码有问题。我试着按照其他人的建议使用display:inline-block;,但它仍然不起作用。

.gva-navigation > ul > li {
    position: relative;
    z-index: 100;
}

.gva-navigation  > ul > li > ul {
    position: absolute;
    padding: 0 1000em; /* trick from css-tricks comments */
    margin: 0 -1000em; /* trick from css-tricks comments */
}

.gva-navigation > ul > li:hover > ul {
    position: absolute;
    display: none; 
    left: 0;
}

.gva-navigation > ul > li > ul > li {
     position: absolute;
    display: inline-block; 
    left: 0;
}

.gva-navigation > ul > li > ul > li > ul {
    position: absolute;
} 
<div class="gva-navigation">
    <ul class="clearfix gva_menu gva_menu_main"> 
        <li class="menu-item menu-item--expanded">
            <a target="_self" href="#">
                    Departments <span class="icaret nav-plus fa fa-angle-down"></span> </a>
            <ul class="menu sub-menu" style="margin-top: -30px;">
                <li class="menu-item">
</li>
                <li class="menu-item">
                    <a target="" href="en/Economics.html">
                    ECONOMICS/ISLAMIC ECONOMICS</a>
                </li>
                <li class="menu-item">
                    <a target="" href="en/Finance.html">
             FINANCE/ISLAMIC FINANCE</a>
                </li>
                <li class="menu-item"> 
                    <li class="menu-item menu-item--expanded">
                        <a target="" href="en/Training.html">
                    TRAINING </a>
                    </li>                     
                    <li class="menu-item mune-item--expanded">
                        <a target="" href="en/Information_Center.html">
                    INFORMATION CENTER </a>
                    </li>                     
                    <li class="menu-item mune-item--expanded">
                        <a target="" href="en/JOURNAL_OF_NEW_ECONOMICS.html">
        JOURNAL OF NEW ECONOMICS </a>
                    </li>
            </ul>
        </li>         
        <li class="menu-item menu-item--expanded"> 
            <a target="" href="#">
                    Teaching & Performance <span class="icaret nav-plus fa fa-angle-down"></span></a> 
            <ul class="menu sub-menu" style="margin-top: -30px;">
                <li class="menu-item"> 
                    <a target="" href="en/Teaching_Approaches.html">
                    Teaching Approaches</a> 
                </li>
                <li class="menu-item"> 
                    <a target="" href="en/Midway_Approach.html">
                    Midway Approach</a>
                    <li class="menu-item"> 
                        <a target="" href="en/Graduates_Profile.html">
                Graduates Profile</a>
                    </li>
            </ul>             
        </li>         
        <li class="menu-item menu-item--expanded">
            <a target="_self" href="#">
                    Admissions <span class="icaret nav-plus fa fa-angle-down"></span> </a>
            <ul class="menu sub-menu" style="margin-top: -30px;">
                <li class="menu-item">
                    <a target="" href="en/students.html">
                    Admission Requirements <span class="icaret nav-plus fa fa-angle-down"></span></a>
                    <ul class="menu sub-menu">
                        <li class="menu-item"> 
                            <a target="" href="en/3_Tracks_for_BA_Holders.html">
                    3 Tracks for BA Holders</a> 
                        </li>
                        <li class="menu-item"> 
                            <a target="" href="en/Language_Requirements.html">
                    Language Requirements</a> 
                        </li>
                        <li class="menu-item"> 
                            <a target="" href="en/Grades.html">
                    Grades</a> 
                        </li>
                        <li class="menu-item"> 
                            <a target="" href="en/Admission_Course_Requirements.html">
                    Admission Course requirements</a> 
                        </li>
                    </ul>
                </li>
                <li class="menu-item">
                    <a target="" href="https://obs.asbu.edu.tr/oibs/ogrenci/login.aspx">
                    Applications and Deadlines  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="https://www.asbu.edu.tr/tr/akademik-takvim">
                    International Students  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="en/student-work-forms.html">
                    Apply </a>
                </li>
            </ul>
        </li>         
        <li class="menu-item menu-item--expanded">
            <a target="_self" href="#">
                    Student <span class="icaret nav-plus fa fa-angle-down"></span> </a>
            <ul class="menu sub-menu" style="margin-top: -30px;">
                <li class="menu-item">
                    <a target="" href="en/students.html">
                    For Students  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="https://obs.asbu.edu.tr/oibs/ogrenci/login.aspx">
                    Student Information System  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="https://www.asbu.edu.tr/tr/akademik-takvim">
                    Academic Calendar  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="en/student-work-forms.html">
                    Student Work Forms  </a>
                </li>
            </ul>
        </li>         
        <li class="menu-item menu-item--expanded"> 
            <a target="_self" href="#">
                    Course Requirements<span class="icaret nav-plus fa fa-angle-down"></span> </a> 
            <ul class="menu sub-menu" style="margin-top: -30px;">
                <li class="menu-item"> 
                    <a target="" href="en/MA_and_PHD_in_Economics.html">
                    MA & PHD IN ECONOMICS/ISLAMIC ECONOMICS <br> (DOUBLE MAJOR)</a> 
                </li>
                <li class="menu-item"> 
                    <a target="" href="en/MA_and_PHD_in_Finance.html">
                     MA & PHD IN FINANCE/ISLAMIC<br>FINANCE<br>(DOUBLE MAJOR)</a> 
                </li>
            </ul>             
        </li>         
        <li class="menu-item menu-item--expanded">
            <a target="_self" href="#">About&nbsp;<span class="icaret nav-plus fa fa-angle-down"></span></a>
            <ul class="menu sub-menu" style="margin-top: -30px;
    left: -100px;">
                <li class="menu-item" style="display: inline-block"> 
                    <a target="_self" href="#">
                    Founding Stage<span class="icaret nav-plus fa fa-angle-down"></span> </a> 
                    <ul class="menu sub-menu"> 
                        <li class="menu-item">
                            <a target="" href="en/background.html" style="white-space: nowrap;">
                    Background  </a>
                        </li>                         
                        <li class="menu-item">
                            <a target="" href="en/objectives.html">
                    Objectives  </a>
                        </li>                         
                        <li class="menu-item">
                            <a target="" href="en/name.html">
                    Name  </a>
                        </li>
                        <li class="menu-item">
                            <a target="" href="en/approach.html">
                    Approach  </a>
                        </li>
                    </ul>                     
                </li>
                <li class="menu-item">
                    <a target="_self" href="en/Faculty.html">
                    Faculty </a>
                </li>
                <li class="menu-item">
                    <a target="" href="https://asbu.edu.tr/tr/iletisim-bilgileri">
                    Contact Information  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="en/contact.html">
                    Contact Form  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="https://asbu.edu.tr/tr/ulasim">
                    Transportation  </a>
                </li>
                <li class="menu-item">
                    <a target="" href="https://asbu.edu.tr/tr/contact/bilgi_edinme">
                    Getting Information  </a>
                </li>
                <li class="menu-item">
                    <a target="_self" href="en/Stages_of_Implementation.html">
                    Stages of Implementation </a>
                </li>
                <li class="menu-item">
                    <a target="" href="en/Organisational_Chart.html">
                    Organisational Chart  </a>
                </li>
            </ul>
        </li>         
        <li class="menu-item menu-item--collapsed"> 
            <a target="_self" href="en/Annotated_List_of_Courses.html">
                    Annotated List of Courses </a> 
        </li>         
    </ul>
</div>

共有1个答案

姚正真
2023-03-14

我删除了所有其他css和功能工作。

您要查找的内容如下:

.gva-navigation>ul>li>ul {
    display: none;
}

.gva-navigation>ul>li:hover>ul {
    display: inline;
}
 类似资料:
  • 我使用火狐浏览器。我尝试鼠标悬停在菜单上,但不显示其相应的子菜单,当悬停在主菜单上使用selenium网络驱动程序。它只选择菜单“索赔”,并仅在那里停止。它不执行testScript进一步,因为鼠标悬停子菜单不显示。所以呢 超文本标记语言代码 我必须悬停在菜单"索赔"和选择子菜单"新索赔" 在此处输入图像描述 硒代码 如下图所示,驾驶员检测到菜单“声明”,因为它的颜色比其他菜单的颜色稍暗。但子菜单

  • 我正在尝试将鼠标悬停在动画菜单上并在菜单中选择一个项目。我尝试先通过xpath在菜单上执行悬停,然后通过xpath执行单击菜单项,如下所示。 我有个例外 org.openqa.selenium.interactions。MoveTargetOutOfBoundsException:元素内的偏移量无法滚动到视图中 我还尝试将这些行为链接如下: 这也会引发相同的异常。 有什么想法来实现动画菜单项的点击

  • 我自己处理悬停事件来添加一个三角形指针和一个水平对齐的子菜单栏。当单击顶部菜单时,它可以很好地显示和导航到子菜单。问题是在悬停期间,试图将鼠标移动到子菜单时,子菜单栏会消失。 TIA 代码: null null

  • 问题内容: 我正在构建HTML5游戏,并且尝试将鼠标指针放在特定事件上的某个控件上,以便在特定方向上移动始终具有相同的结果。这可能吗? 问题答案: 因此,我知道这是一个古老的话题,但是我首先要说这是不可能的。当前最接近的事情是将鼠标锁定在单个位置,并跟踪其x和y的变化。这个概念已经被Chrome和Firefox所采用。它由所谓的 Mouse Lock进行管理 ,点击逃逸将破坏它。通过我的 简要 阅

  • 我是javafx新手,目前正在做菜单,menuitems。我希望覆盖显示上下文菜单的默认事件,即使菜单没有被按下,但鼠标悬停在它上面,而相邻菜单的上下文菜单显示时,当前仍会显示。这发生在每个应用程序中,因为它非常方便。但由于某种原因,我不需要它。我试图捕获菜单上的鼠标事件,这样我就可以相应地工作,但什么也没发生。 这里是我想要添加此行为的菜单。

  • 您上载的APK签名无效(了解有关签名的更多信息)。来自apksigner的错误:Error(Jar signer cert.rsa):Jar签名meta-inf/cert.sf表明APK是使用APK签名方案v2签名的,但是没有找到这样的签名。签名被剥了?