jQuery Change Image on Scroll at Responsive Breakpoint

Question

У меня есть сценарий, работающий отлично, что изменяет изображение/логотип в прокрутке, но я хочу, чтобы это было только в том случае, если окно браузера больше 767 пикселей - в противном случае ничего/сохранить 'как есть' , Как я могу изменить этот сценарий, чтобы достигнуть этого, пожалуйста: -

jQuery(function($) { 
//caches a jQuery object containing the brand image element 
var brandimg = $(".x-brand img"); 
$(window).scroll(function() { 
var scroll = $(window).scrollTop(); 
// if($(window).width() > 767 { 
    if (scroll >= 40) { 
     brandimg.attr('src', 'logo-icon.png'); 
     brandimg.removeClass('x-img-1').addClass("img-2"); 
    } else { 
     brandimg.attr('src', 'logo-full.png').addClass("logo-full"); 
     brandimg.removeClass("x-img-2").addClass('img-1'); 
    } 
}); 
}); 

Я не могу использовать медиа-запрос здесь тему «Wordpress» использует изображение, а не фоновое изображение.

Не знаете, может быть, дополнительная, если утверждение окружает текущую функцию?

Благодаря

Glennyboy

Answer 1

Это, как я сделал это в конце концов: -

jQuery(function($) { 
//caches a jQuery object containing the brand image element 
var brandimg = $(".x-brand img"); 
jQuery(window).on("focus load resize scroll",function(e){ 
var scroll = $(window).scrollTop(); 
if (($(window).width() < 460) || (scroll >= 40)) { 
     brandimg.attr('src', 'logo-icon.png'); 
     brandimg.removeClass('x-img-1').addClass("x-img-2"); 
    } else { 
     brandimg.attr('src', 'logo-full.png').addClass("logo-full"); 
     brandimg.removeClass("x-img-2").addClass('x-img-1'); 
    } 
}); 
}); 

И это отлично работает для прокрутки и размера окна на нагрузке, изменение размера и прокрутки