Question

is there a way to change the jQuery data-type:

data-type="horizontal"

to:

data-type="vertical"

When the display is on a phone vs an ipad or desktop? I’m using media queries for everything else, but I’m wondering if there is a JavaScript way to change these or a preferred jQuery Mobile way to do it.

Answer 1

Figured this out, very easy.

if ($('body').width()<=767) {
    $('.switch-type').attr('data-type', 'vertical');
}

Just add the switch-type class to any data-types you want to change when the resolution goes to 767 or lower.

You could also use screen.width, but then this won’t change the type when a browser screen is very small.