На jquery написал обработчик события resize. Что бы сайт был адаптивным.
Но теперь он лагет после изменения размера экрана.
Я заметил что лаги в основном происходят из-за prepend, append, after, before...
var isMobileDisplay;
$(window).on('resize', function () {
if ($(window).outerWidth() < 950) {
$('.content').after($('.sidebar'));
} else {
$('.content').before($('.sidebar'));
}
if ($(window).outerWidth() <= 500) {
if (!sliderIsLive) {
$('.slider-inner').slick({
prevArrow: '<div class="prev"><a href="#"></a></div>',
nextArrow: '<div class="next"><a href="#"></a></div>',
});
sliderIsLive = true;
$('.prev').on('click', function (e) {
e.preventDefault();
});
$('.next').on('click', function (e) {
e.preventDefault();
});
}
} else if (sliderIsLive) {
$('.slider-inner').slick('unslick');
sliderIsLive = false;
}
if ($(window).outerWidth() <= 600) {
if (!isMobileDisplay) {
isMobileDisplay = true;
$('.menu').prependTo($('.wrapper'));
$('.sub-menu').prependTo($('.menu > ul'));
$('.submenu').after($('.sub-menu'));
}
} else if (isMobileDisplay) {
isMobileDisplay = false;
$('.menu').prependTo($('.content'));
$('.sub-menu').appendTo($('.submenu'));
}
});
