4

I have the following code running and I need to make it stop if you are using a mobile device

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

Can I use something like if($(window).width()<600){ /* do something */ } If so what shall I write between the curved brackets?

Thank you!

Nesta
  • 950
  • 2
  • 12
  • 39
  • Your solution looks like it will work - have you even tried it? – Wez Feb 04 '14 at 15:00
  • 2
    Just invert it (`.width() > 600`) and place your code within. – Brad Christie Feb 04 '14 at 15:00
  • You're on the right track but instead of preventing below 600 why not just execute above 600? – Vian Esterhuizen Feb 04 '14 at 15:00
  • 7
    NO NO NO. Do not use the window width to determine if it is a mobile device! – musefan Feb 04 '14 at 15:01
  • 3
    The is a question that might help you [here.](http://stackoverflow.com/questions/3514784/what-is-the-best-way-to-detect-a-handheld-device-in-jquery) – Wez Feb 04 '14 at 15:02
  • 4
    It's going to be particularly difficult to implement this using window width due to the fact that a non-mobile browser can be resized down to those widths too. When that happens, you would have to undo what the script did, then redo it when it's resized back out, etc. Just check the useragent. Or better yet, don't design around equal-height columns unless you're giving them a static height. – Kevin B Feb 04 '14 at 15:05

2 Answers2

6

You can try:

if(!(/iPhone|iPad|iPod|Android|webOS|BlackBerry|Opera Mini|IEMobile/i.test(navigator.userAgent) )) {

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

}

So if it is not a mobile device then you run the code

Using $(window).width it is not a very good solution. Think what will happen if i am not using a mobile device and just change dimensions in my browser window

laaposto
  • 10,927
  • 15
  • 49
  • 67
2

Try this :

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() ) {....} else { // place your code here }
SivaRajini
  • 6,411
  • 17
  • 72
  • 117