UPDATE:
$(document).ready(function() {
$(window).resize(function() {
if($(window).width()<=768) {
$("#element").removeClass("dropdown-menu");
}else{
$("#element").addClass("dropdown-menu");
}
});
if($(window).width()<=768) {
$("#element").removeClass("dropdown-menu");
}else{
$("#element").addClass("dropdown-menu");
}
});
Now I've tried again with remove and add classes and it works.
http://codepen.io/julianschmuckli/pen/ybYzQe
You can do execute the code, after the page was finished loading:
$(document).ready(function() {
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
$("#element").dropdown("toggle");
}
});
To detect if it is mobile, I copied the snippet from here: What is the best way to detect a mobile device in jQuery?
Or you can also try this version to define it with a specific width of page:
$(document).ready(function() {
if($(window).width()<=768) {
$("#element").dropdown("toggle");
}
});