функция изменения размера jQuery не работает при загрузке страницы

Как заставить эту функцию работать не только при изменении размера окна, но и при начальной загрузке страницы?

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

5 ответов


вы захотите использовать:

$(document).ready(function() { /* your code */ });

чтобы что-то произошло onload. Если вы хотите, чтобы что-то работало onload и onresize, вы должны сделать:

onResize = function() { /* your code */ }

$(document).ready(onResize);

$(window).bind('resize', onResize);

Я думаю, что лучшее решение - просто привязать его к событию загрузки и изменения размера:

$(window).on('load resize', function () {
    // your code
});

это поведение по дизайну.

вы должны поместить ваш код в именованную функцию, а затем вызвать функцию.

например:

function onResize() { ... }

$(onResize);
$(window).resize(onresize);

кроме того, вы можете сделать плагин для автоматической привязки и выполнения обработчика:

$.fn.bindAndExec = function(eventNames, handler) {
    this.bind(eventNames, handler).each(handler);
};

$(window).bindAndExec('resize', function() { ... });

обратите внимание, что он не будет работать правильно, если обработчик использует event объект, и что он не покрывает каждую перегрузку bind метод.


$(document).ready(onResize);
$(window).bind('resize', onResize);

не работал со мной.

попробовать

$(window).load('resize', onResize);
$(window).bind('resize', onResize);

вместо.

(Я знаю, что этот вопрос старый, но google отправил меня сюда, так что...)


другой подход, вы можете просто настроить обработчик и подделать событие изменения размера самостоятельно:

// Bind resize event handler through some form or fashion
$(window).resize(function(){
  alert('Resized!');
});

// Trigger/spoof a 'resize' event manually
$(window).trigger('resize');