jQueryを使っていて、複数のイベント（アクション）に対応させたい場合、またはjQueryで後から表示したものにも対応させたい場合って、あると思います。
jQueryって便利ですよね。いろいろなアクションができ、さらにプラグインも豊富にあるので、何でもできるような気がしてきます。
jQueryのアクション（イベント）はよく使うものとして、【load】【ready】【scroll】【click】【resize】など、さまざまなものがありますが、同時に使う？複数のイベントをjQueryで表示したものにもイベントを対応させる？という方法もあります。
最近で良くある場面としては、画像が横幅をデバイスいっぱいにするときに、
- (1)表示された時
- (2)ウィンドウの幅を変えた時の２つに対応させたい場合などに使います。
普段のjQueryの使い方は、
[code language=”css”]
$(document).ready(function(){
}
[/code]
こんな感じだと思いますが、同時に複数のイベントを適用したり、jQueryで表示したものに適用させるには、
[code language=”css”]
$(‘#idまたは.class’).on(“click resize”, function(){
}
//または
$(window).on(‘load resize’,’#idまたは.class’,function(){
}
[/code]
このように記述すれば、複数のイベントを適用したり、jQueryで後から表示したものにも適用できます。
