$(function(){
if($(window).width()>1100){
$("#logo").hover(function(){
$(this).animate({paddingTop:"0px",paddingBottom:"20px"},200);
},function(){
$(this).animate({paddingTop:"20px",paddingBottom:"0"},200);
});
}
$(window).resize(function(){
if($(window).width()>1100){
$("#logo").hover(function(){
$(this).animate({paddingTop:"0px",paddingBottom:"20px"},200);
},function(){
$(this).animate({paddingTop:"20px",paddingBottom:"0"},200);
});
}
});
});
Прямо сейчас, эта анимация выполняется только тогда, когда ширина окна больше 1100 пикселей, но для обновления браузера требуется "обновление" браузера. Как это можно устранить, чтобы обновление браузера не требовалось?
Регистрируйте/Отмените регистрацию обработчиков в событии изменения размера на основе размера окна.
$(function () {
$(window).resize(function () {
if ($(window).width() > 1100) {
$("#logo").on('mouseenter.anim', function () {
$(this).animate({
paddingTop: "0px",
paddingBottom: "20px"
}, 200);
}).on('mouseleave.anim', function () {
$(this).animate({
paddingTop: "20px",
paddingBottom: "0"
}, 200);
});
} else {
$("#logo").off('mouseenter.anim mouseleave.anim');
}
}).resize();
});
Демо: скрипка
Назовите свою функцию и прослушайте событие изменения размера так:
$(window).on("resize", yourfunction());