重複の可能性:
jQueryまたはASP.NETを使用して、ページをダウンロードしてから、ページ上の画像を非同期にダウンロードする方法は?
window.load()関数に実装されたJSコードを介して背景画像を追加したい。基本的に、必要なのはページの読み込みを高速化することです。次に、ページがレンダリングされるときに、要素に背景画像を追加します。
私はこのコードを使用します:
<script>
$(window).load(function() {
$('#image2').css('background-image','url(images/people-big-2.jpg)');
$('#image3').css('background-image','url(images/people-big-3.jpg)');
$('#image4').css('background-image','url(images/people-big-4.jpg)');
$('#image5').css('background-image','url(images/people-big-5.jpg)');
$('#image5').css('background-image','url(images/people-big-6.jpg)');
$('#image7').css('background-image','url(images/people-big-7.jpg)');
$('#image8').css('background-image','url(images/people-big-8.jpg)');
$('#image9').css('background-image','url(images/people-big-9.jpg)');
$('#image10').css('background-image','url(images/people-big-10.jpg)');
$('#image11').css('background-image','url(images/places-big-1.jpg)');
$('#image13').css('background-image','url(images/places-big-3.jpg)');
$('#image16').css('background-image','url(images/places-big-6.jpg)');
$('#image17').css('background-image','url(images/places-big-7.jpg)');
$('#image18').css('background-image','url(images/places-big-8.jpg)');
$('#image19').css('background-image','url(images/places-big-9.jpg)');
$('#image21').css('background-image','url(images/places-big-11.jpg)');
$('#image24').css('background-image','url(images/places-big-14.jpg)');
$('#image25').css('background-image','url(images/places-big-15.jpg)');
$('#image26').css('background-image','url(images/places-big-16.jpg)');
$('#image27').css('background-image','url(images/things-big-1.jpg)');
$('#image28').css('background-image','url(images/things-big-2.jpg)');
$('#image29').css('background-image','url(images/things-big-3.jpg)');
$('#image30').css('background-image','url(images/things-big-4.jpg)');
$('#image31').css('background-image','url(images/things-big-5.jpg)');
$('#image32').css('background-image','url(images/things-big-6.jpg)');
$('#image33').css('background-image','url(images/things-big-7.jpg)');
$('#image34').css('background-image','url(images/things-big-8.jpg)');
$('#image35').css('background-image','url(images/things-big-9.jpg)');
$('#image36').css('background-image','url(images/things-big-10.jpg)');
$('#image37').css('background-image','url(images/things-big-11.jpg)');
$('#image38').css('background-image','url(images/things-big-12.jpg)');
$('#image39').css('background-image','url(images/things-big-13.jpg)');
$('#image40').css('background-image','url(images/water-big-1.jpg)');
$('#image41').css('background-image','url(images/water-big-2.jpg)');
$('#image42').css('background-image','url(images/water-big-3.jpg)');
$('#image43').css('background-image','url(images/water-big-4.jpg)');
$('#image44').css('background-image','url(images/water-big-5.jpg)');
$('#image45').css('background-image','url(images/water-big-6.jpg)');
$('#image46').css('background-image','url(images/water-big-7.jpg)');
$('#image47').css('background-image','url(images/water-big-8.jpg)');
$('#image48').css('background-image','url(images/water-big-9.jpg)');
$('#image49').css('background-image','url(images/water-big-10.jpg)');
});
</script>
しかし、これは機能しません。私の背景画像はすべて、最初の読み込み時にまだ読み込まれています。それを機能させる方法、それでそれはページがロードされた後にだけこのコードを追加します。
これをボディのクリックイベント内に配置できるということですが、それはばかげています。