Как запустить функцию jquery, но только когда ширина окна браузера> 1024px?

Question

Как запустить функцию jquery, но только когда ширина окна браузера> 1024px?

Эту функцию я хотел бы добавить на свой отзывчивый одностраничный веб-сайт, но только когда ширина браузера превышает 1024 пикселя.

Мои знания jQuery минимальны. Вот код, который у меня есть сейчас:

$(document).ready(function() {
        var pageWidth = $(window).width();
        if (pageWidth > 1024) {

$('.footer a').mouseenter(function() {
$(this).effect("bounce", { times:1, distance:4 }, 250);
});

});
});

Это код, который у меня есть в HTML, который загружает эту функцию:

<script type="text/javascript" src="js/tiny-bounce.js"></script>

Другой вопрос, когда эта функция не срабатывает - например, когда пользователь загружает сайт на устройстве с шириной < 1024 пикселей, им все равно нужно загружать файл javascript?

0

jquery media-queries browser-width

Источник

user640293 03 дек '12 в 05:18

2 ответа

Другие вопросы по тегам jquery media-queries browser-width

user1147197 03 дек '12 в 05:34 2012-12-03 05:34 · Answer 1 · 2012-12-03 05:34

Все, что вам нужно сделать, это

вместо этого

if (pageWidth > 1024) {

сделай это

if (pageWidth < 1024) {

1

Источник

user1147197 03 дек '12 в 05:34

user198480 03 дек '12 в 05:34 2012-12-03 05:34 · Answer 2 · 2012-12-03 05:34

Да, вам все равно придется загружать код JS, когда ширина меньше 1024, если вы не включите этот код в свой HTML или существующий скрипт JS.

Я верю, что вы можете позвонить $(window).width() без $(document).ready(), так что это может быть одним из способов уменьшить влияние наличия этого дополнительного кода на маленьких экранах.