以指定的分辨率暂停引导轮播答案

【问题标题】：Pause bootstrap carousel at specified resolution以指定的分辨率暂停引导轮播
【发布时间】：2015-10-30 17:12:03
【问题描述】：

我正在尝试以低于 640 像素的任何分辨率暂停引导轮播。我尝试了许多不同的看似直观的方法来做到这一点，但没有任何效果。

目前我有：

   $(document).ready(function(){
        if ($(window).width() > 640) {
            $('.carousel').carousel('pause');
        } else {
            $('.carousel').carousel();
        };

});

【问题讨论】：

这只会在页面加载时尝试暂停轮播一次。您是否通过调整浏览器大小而不重新加载来测试它？将这种操作绑定到$(window).on('resize', function(){ ... }) 事件监听器会更加健壮。
我已经通过调整大小和重新加载对其进行了测试。很奇怪。似乎它必须是jquery以外的东西......
你在哪里测试它？它是在您自己的环境中、在 jsfiddle 上还是在 bootply 中？我似乎无法让 pause 在 bootply 中工作，但这可能只是因为它是 iframe 的（或者至少我假设它是）。
我让它工作了，但只有在将它包装在窗口的load 事件侦听器中之后。 bootply.com/JxL8isRuQR。编辑：viewing it on codeply 可以更轻松地调整屏幕大小。
带有 (window).on("load"... 是否还需要 (document).ready(... 如果脚本嵌入在 html 中？

标签： jquery twitter-bootstrap twitter-bootstrap-3 bootstrap-carousel

【解决方案1】：

您的代码在 else 语句中缺少 'cycle' 属性，以便轮播开始。我还包括了一个评论 .on 监听器，以防你想主动检查宽度变化。例如，如果用户调整窗口大小。

  $(document).ready(function(){
     //$(window).on( "resize", function(){
            if ($(window).width() > 640) {
                $('.carousel').carousel('pause');
            } else {
                $('.carousel').carousel('cycle');
            }
         //console.log($(window).width());
      //})
     });

【讨论】：