如何在移动设备中停止自举旋转木马自动滑动

时间:2014-10-15 10:26:57

标签: javascript css twitter-bootstrap carousel

您好,我试图找到一种方法来阻止bootstraps轮播自动滑动功能仅在移动设备中停止。我尝试使用javascript自己执行此操作,但我使用过的代码似乎无法正常工作。

var ismobile = window.matchMedia("only screen and (max-width: 760px)");

    if (ismobile.matches) {
        $('.carousel').carousel ({
            interval:false
        });
    }

3 个答案:

答案 0 :(得分:4)

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
 $('.carousel').carousel ({
   interval:false
 });
}

来自here

答案 1 :(得分:2)

稍微更新,因为我上面的代码片段也遇到了一些麻烦,因为它没有完成工作。

(function(){

    var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
    var windowIsThin = window.matchMedia("(max-width:992px)").matches;

    if (isMobile || windowIsThin) {
        //carousel disabled
        $('.carousel').carousel({
            interval: false
        });
    }; 

});

在chrome,IE,Firefox和Opera中测试过。

答案 2 :(得分:2)

我正在使用这个,为我工作:

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

$('.carousel').carousel ({
    interval: isMobile.any() ? false : 5000
});

来源:http://www.abeautifulsite.net/detecting-mobile-devices-with-javascript/