文章/答案/技术大牛

发布

社区首页 >问答首页 >slideDown不工作

问slideDown不工作
EN

Stack Overflow用户

提问于 2015-11-02 05:13:34

回答 2查看 129关注 0票数 1

我不能让slideDown函数工作，也不知道为什么，当我将鼠标悬停在"école“菜单项中时什么也没有发生。

html代码：

<body>
  <div id="background_bleu">
  <div id="global">
  <header> 
    <div id="block_search">
    <img id="search" src="image/search.png"> 
    <input id="input_search" type="search"/>
    <input id="go" type="button" value="Go"/>    <p id="title_search">   
    Advance Search</div>
  <menu id="menu1">
  <ul id="nav"> 
     <li> <a href="#"> Accueil </a> </li>
     <li> <a href="#"> L'école </a>
       **<ul>
          <li> <a href="#"> Qui sommes-nous ? </a></li>
          <li> <a href="#">L'équipe pédagogique </a></li>
          <li> <a href="#">Espace parent </a></li>
          <li> <a href="#">Réglement intérieur </a></li>
          <li> <a href="#">Tarifs </a></li>**
      </ul>
     </li>
     .....

和jQuery代码

$(document).ready(function(){
  $('#menu1 #nav li').hover(function(){
    function(){
        $('ul').slideDown();
    },
    function(){
        $('ul').slideUp(); }
 });
});

jquery

slidedown

回答 2

Stack Overflow用户

发布于 2015-11-02 05:25:24

请使用以下脚本以使其正常工作：

$(document).ready(function(){
  $('#menu1 #nav li').hover(function(){
        $('ul', this).stop(true, true).slideDown();
    },function(){
        $('ul', this).slideUp();
    });
});

和CSS代码：

#menu1 #nav ul { display: none; }

在脚本中，当您使用$('ul', this)时，它表示事件(悬停)的父事件的子ul。

票数 0

Stack Overflow用户

发布于 2015-11-02 05:27:18

您的hover方法调用中包含的函数太多了。它最多只能接受两个函数参数。

此外，您会发现页面上的所有ul元素都会上下滑动。您需要通过查找当前hover调用的后代的ul元素来进行过滤。

$(document).ready(function() {
  $('#menu1 #nav li').hover(
    function() {
      $(this).find('ul').slideDown();
    },
    function() {
      $(this).find('ul').slideUp();
    }
  );
});

#nav ul {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<menu id="menu1">
  <ul id="nav">
    <li><a href="#">Accueil</a></li>
    <li><a href="#">L'école</a>
      <ul>
        <li><a href="#">Qui sommes-nous?</a></li>
        <li><a href="#">L'équipe pédagogique</a></li>
        <li><a href="#">Espace parent</a></li>
        <li><a href="#">Réglement intérieur</a></li>
        <li><a href="#">Tarifs</a></li>
      </ul>
    </li>
  </ul>
</menu>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/33467285

复制

相似问题

问slideDown不工作
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问slideDown不工作EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问slideDown不工作
EN