jquery - jQuery のサイズ変更機能がページの読み込み時に機能しない

Question

この関数をウィンドウのサイズ変更時だけでなく、最初のページ読み込み時にも実行するにはどうすればよいですか?

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

Answer 1

使用する必要があります：

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

オンロードで何かを起こさせるため。何かをonloadおよびonresizeで動作させたい場合は、次のことを行う必要があります。

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

$(document).ready(onResize);

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

Answer 2

この動作は仕様です。

コードを名前付き関数に入れてから、関数を呼び出す必要があります。

例えば：

function onResize() { ... }

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

---

または、ハンドラーを自動的にバインドして実行するプラグインを作成できます。

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

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

ハンドラーがオブジェクトを使用する場合は正しく機能しないことに注意してください。また、メソッドeventのすべてのオーバーロードをカバーしているわけではありません。bind

Answer 3

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

私とはうまくいきませんでした。

試す

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

代わりは。

（この質問は古いことは知っていますが、Googleがここに送ってくれたので...）

Answer 4

別のアプローチとして、単純にハンドラーをセットアップし、サイズ変更イベントを自分でスプーフィングすることができます。

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

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