1

imgタグのデータ属性に保存されている画像をプリロードできる必要があります

   <div id="slider" class="nivoSlider">
      <a href="#"><img src="http://domain.com/wp-content/themes/xx/images/heros/1-Image.jpg" data-overlay1="http://domain.com/wp-content/themes/xx/images/heros/1-Blog.png" data-overlay2="http://domain.com/wp-content/themes/xx/images/heros/1-anotherimage.png" /></a>

    <a href="#"><img src="http://domain.com/wp-content/themes/xx/images/heros/2-Image.jpg" data-overlay1="http://domain.com/wp-content/themes/xx/images/heros/2-Blog.png" data-overlay2="http://domain.com/wp-content/themes/xx/images/heros/2-anotherimage.png" /></a>
   </div>

基本的に、data-overlay1とdata-overlay2に画像をプリロードする必要があります。

どうすればいいですか?

4

2 に答える 2

3

これらのURLを見つけて、次のようにプリロードできます。

var preloadImgs = [];
$(document).ready(function() {
    $("#slider img").each(function() {
        var img = new Image();
        img.src = $(this).data("overlay1");
        preloadImgs.push(img);
        img = new Image();
        img.src = $(this).data("overlay2");
        preloadImgs.push(img);
    });
});
于 2012-08-18T05:56:08.970 に答える
2
$('#slider img').each(function(index, element) {
    $('<img/>')[0].src = $(element).attr('data-overlay1');
    $('<img/>')[0].src = $(element).attr('data-overlay2');
});
于 2012-08-18T06:16:08.917 に答える