Hide item in div on mobile devices

Viewed 51

How can I turn off an item data-toggle="select" only on mobile devices? I found how to remove a class using Jquery. But how do you turn off the whole element in a div (I don't want to turn off the entire div, only part data-toggle="select")?

<select name="type" data-toggle="select" id="id_type">
  [...]
</select>
2 Answers

As mentioned you can use the @media queries to hide the element like this:

@media (max-width: 1080px) { // use any amount that you want
 select[data-toggle="select"] {
   display: none;
 }
}

Maybe test(navigator.userAgent) can help you.

var isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); //Check if it's running on a mobile device
var element = document.getElementById('text');
if (isMobile) {
 document.getElementById("id_type").setAttribute("data-toggle", "");
} else {
 document.getElementById("id_type").setAttribute("data-toggle", "select");
}

Related