问jQuery在桌面解析中禁用SlideToggle
EN

Stack Overflow用户

提问于 2016-10-17 20:40:52

回答 1查看 802关注 0票数 1

我有一个边栏，有三个部分：

在移动解析中，这些部分看起来像手风琴选项卡，只有标题是可见的，单击 header 元素中的锚会触发slideToggle，后者显示/隐藏该部分中的其余内容。这个很管用。
在桌面分辨率中，这三个部分和它的整个内容总是可见的，所以基本上点击标题不应该做任何事情。当我在桌面解析中加载/刷新页面时，单击header锚元素不会有任何作用(这很棒)，但是如果我切换到移动分辨率，然后切换回桌面分辨率，然后单击header锚元素就会切换内容，所以请告诉我，如何在桌面中停止这种slideToggle效果。

jQuery代码：

$(window).on('load resize', function(){     

   if ($('#page-content').width() < 991 ) {

        $('#primary-sidebar header > a').click(function(e) {
            e.preventDefault();
            $(this).parent('header').siblings('.widget').slideToggle();
        });
   } else if ($('#page-content').width() > 992 ) {

        $('#primary-sidebar header > a').click(function(e) {
            return false;
        });
   }
});

谢谢！

javascript

jquery

回答 1

Stack Overflow用户

发布于 2016-10-17 22:37:29

虽然解除绑定单击事件有效，但$(window).on('load resize', function(){正在创建问题，在调整窗口大小时，slideToggle效果将在单次单击时多次运行。不需要调整代码的窗口大小/加载线。下面的代码非常适合我。

 $('#primary-sidebar header > a').on('click', function(e) {
    e.preventDefault();

    var width = $('#page-content').width();

    if (width <= 991) {
        $(this).parent('header').siblings('.widget').slideToggle();
        $(this).find('.fa.fa-chevron-left').toggleClass('fa-chevron-down');
    } 
});

票数 0

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

原文链接：

https://stackoverflow.com/questions/40095302

复制

相似问题

问jQuery在桌面解析中禁用SlideToggle
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery在桌面解析中禁用SlideToggleEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery在桌面解析中禁用SlideToggle
EN