Как вызывать jQuery виджет только в определенном разрешении?

Главные вкладки

Аватар пользователя VasyOK VasyOK 14 декабря 2019 в 13:56

Допустим есть jQuery виджет https://jqueryui.com/tabs/
И нужно, чтобы вкладки были только на экранах с шириной менее 600рх. А на больших экранах чтобы виджет не обрабатывал HTML. Т.е. display: none - не подходит.

Написал такой вот код:

function tabs_behavior() {
   if ($(window).width() < 600) {
        $("#tabs").tabs();    
   } else {
        $("#tabs").tabs("destroy");  
   }
}

tabs_behavior();

$(window).resize(function() {
        tabs_behavior();            
});

https://jsfiddle.net/PlayboyZP/1d6jh45e/

Если ширину окна изменять от малого к большему - код работает. Вкладки только на маленьком экране.
Если ширину окна изменять от болшего к малому - нет :(. Вкладок нет нигде

А как правильно?

Лучший ответ

Комментарии