Question

我正在构建一个响应式网页，其中包含一个可扩展的3列容器。为实现这一点，我使用以下JS代码：

jQuery(document).ready(function($){
    var inHeight = $("#wrapper").innerHeight();
    $("#wrapper .col").each(function(){
        $(this).height((inHeight+60)+"px");
        $(this).find('.content').height((inHeight)+"px");
    }); 
});

DEMO：http://jsfiddle.net/VTV6B/2/

现在我需要做的是将JS更改为目标移动设备，或者可以将其删除以使每个列独立运行。

如果用户在移动设备上，如何禁用此代码？

Answer 1

尝试这样的事情

         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());
    }
};
             if(isMobile.any()) { your code here }

Answer 2

要定位移动设备（甚至是最大宽度为X像素的更好设备），您可以使用$(window).width()。

但是您的代码的实际问题如下：您尝试使用JS来使您的网站响应，而应该使用CSS媒体查询。

JS仅针对移动设备

2 个答案: