Jquery меню не прячется при отпускании мыши

Question

Jquery меню не прячется при отпускании мыши

0

У меня есть следующее меню (это просто значок, который должен отображать раскрывающееся меню. Я могу заставить меню показать и скрыть с помощью переключателя, но когда я это сделаю, как только я попытаюсь перейти к отображаемым ссылкам, закрывается, если я запускаю его при наведении с добавлением класса, я не могу заставить меню уйти. У кого-нибудь есть способ плавно отобразить и скрыть это меню при помощи мыши и щелкнуть?

   <div id="global_menu">
        <span id="show_global_menu" class="icons_large">(</span>
             <ul id="dropdown" class="hidden">
                 <span class="arrow-u" style="margin-top:-8px;"></span>
                 <li> @Ajax.ActionLink("Icon Legend", "font_legend", null, new AjaxOptions {           UpdateTargetId = "placeholder_extra1", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }, new { @class = "" })</li>
                <li><a href="../Home/Index" title="Sign Out">Sign Out</a></li>
                <li>Support</li>
            </ul>
</div>
    <script>
       $(document).ready(function () {
           if ($("ul#dropdown").hasClass("hidden")) {
               $("span#show_global_menu").hover(function () {
                   $("ul#dropdown").slideDown("slow");
               });
           };
       $("ul#dropdown").hover(function(){
           $("ul#dropdown").mouseout(function () {
               $("ul#dropdown").addClass("hidden");
           });
       });
      });
 </script>

Mark 24 сен. 2013, в 18:19

Источник

Теги:

javascript

jquery

html

2 ответа

0

Попробуйте что-то вроде этого: $ (document).ready(function() {

$("span#show_global_menu").hover(function () {
     $("ul#dropdown").slideDown("slow");
},function(){
      $("ul#dropdown").slideUp("slow");
});


      });
 </script>

Ivan Nikolaievskyi 24 сен. 2013, в 15:06

0

Вы должны убедиться, что остановили предыдущую анимацию, если используете ее как в mouseenter и в mouseleave или вы можете создать раздражающую очередь анимации. $("ul#dropdown").stop().slideUp("slow");
Yan Brunet 24 сен. 2013, в 16:27
0

Это работает, но как только я оставляю свою иконку (#show_global_menu) и пытаюсь навести мой список (ul # dropdown), список скользит UP.
Mark 24 сен. 2013, в 16:29

Ещё вопросы

Вы должны убедиться, что остановили предыдущую анимацию, если используете ее как в mouseenter и в mouseleave или вы можете создать раздражающую очередь анимации. $("ul#dropdown").stop().slideUp("slow");
Это работает, но как только я оставляю свою иконку (#show_global_menu) и пытаюсь навести мой список (ul # dropdown), список скользит UP.

Salim · Accepted Answer · 2013-09-24T13-58-00.000Z

Используй это:

<script>
   $(document).ready(function () {
       if ($("ul#dropdown").hasClass("hidden")) {
           $("span#show_global_menu").hover(function () {
               $("ul#dropdown").slideDown("slow");
           });
       };

       $("ul#dropdown").mouseleave(function () {
           $("ul#dropdown").slideUp('slow');
       });
  });
</script>

Это проверено с вашим кодом. работая как шарм
Спасибо!!! Это вызвало у меня огромную головную боль за то, что я был таким маленьким меню. Ура!