Question

我有一个jquery的问题，我想使用slidedown和up或切换这里是我的代码：

       <div class="vertical-termekek">  <ul class="nav nav-pills nav-stacked" id="vertical-nav"><p>Termékek</p> <li class="dropdown">
       <?php 
         wp_nav_menu(array(
         'container_id' => 'cssmenu', 
       ....)
           )); 
         ?></li>
      </ul></div>


My JQuery SCRIPT

       $(document).ready(function() {
       $('.vertical-termekek').click(function () {
        $('li', this).slideDown(200);
     });
    });

当我全屏垂直菜单不关闭时工作正常我很不想关闭垂直菜单，全屏（禁用功能）但我想使用jquery代码当我去更小的屏幕（992px和更小）我不知道下一步是什么！

如果我走小屏幕没有隐藏李类，但工作上下滑动它使用了这个，因为我也有子菜单，任何人点击子菜单我不想关闭孔垂直菜单只是手风琴下来

     $(function () {
    $('.vertical-termekek').click(function () {
        $('li', this).slideToggle();
    });
    $('.vertical-termekek li').click(function(e) {
        e.stopPropagation();
     });

        //Resize handler to reset the menu visibility 
       var resizeTimer;
       $(window).on('resize', function (e) {
         clearTimeout(resizeTimer);
              resizeTimer = setTimeout(function () {
                  if ($(window).width() > 992) {
              $('li.dropdown').show();
         } else {
             $('li.dropdown').hide();
         }
       }, 250);
     });

      });

这是我的网站：http://fonottkosarbolt.hu/ 但李班显示我不能＆＃39;隐藏如果我做了

的CSS

@media(max-width:768px) { 
li.dropdown{
 display:none;

  }
}

滑落不起工作（令人困惑）并在全屏幕上上下滑动（这对我不好）我想修好屏幕我工作3天我没有任何想法

请帮忙 thx！

我改变了但仍然没有工作

     <div class="vertical-termekek">  <ul class="nav nav-pills nav-stacked           col-md-3 col-sm-12 col-xs-12" id="vertical-nav"> <li class="dropdown">        <p>Termékek</p>
        <?php 
         wp_nav_menu(array(

请更多详情不是亲：S

Answer 1

实现条件点击处理的最简单方法可能是检查click处理程序中窗口的宽度。对于点击事件（不像窗口调整大小），没有任何性能问题。

$('.vertical-termekek').click(function () {
    if (window width is < desktop width) {
        $('.dropdown', this).slideToggle();
    }
});

编辑：我刚看了一下你的网站。您需要使用媒体查询来显示/隐藏菜单作为基本步骤，就像您正在做的那样。但是因为我们应该首先使用移动设备，所以应该隐藏默认样式。然后在媒体查询中使用min-width（不是自移动优先以来的最大宽度）来显示它：

@media screen and (min-width:768px) { 
    li.dropdown{
        display: block; 
    }
}

您可能必须将!important添加到上面的样式，因为jQuery在元素上设置样式，这将占优势。

jquery下滑并切换

1 个答案: