-2

I have a div (#bob_show) that shows and another (#slider_mobile) that's hidden when open on a pc browser. I need there statement to be reversed when open on a mobile device...

Thanks a lot for your help!

Hugo

HugoBoss
  • 3
  • 1
  • 1
    How do you wish to detect 'mobile device'? A media query will look at available sizes (screen/device width etc.), user agent will be passed as part of the request and is a lot more reliable - but is ever-changing as new devices are released. –  Oct 22 '14 at 07:57
  • Use Bootstrap. There is built in class which hides divs in smaller devices. As I remember it is somethimg like: hidden-xs hidden-sm (...) – Klapsa2503 Oct 22 '14 at 08:02

1 Answers1

0

You can detect the navigator type and based upon that you can do the this as desired.

for more refference visit a link this question.

how ever if your concern is browser width then you can go with the below technique

            // you can change the width condition as per your need
            if(window.matchMedia('max-width:420px').matches || $(window).width() < 768){
            // small devide
                $('#slider_mobile').show();
                $('#bob_show').hide();
            }else{
                $('#slider_mobile').hide();
                $('#bob_show').show();
            }
Community
  • 1
  • 1
Abhisek Malakar
  • 778
  • 7
  • 15