jQueryギャラリーに画像をプリロードする

Question

私のウェブサイトにthis galleryを使用したいと思います。唯一の問題は、画像を読み込むために次へをクリックすると時間がかかることです。ユーザーが画像をクリックして拡大すると、次の2つの画像がプリロードされます。

私はthis solutionに出くわしましたが、手動でイメージ名をコーディングしていますが、イメージは動的に読み込まれます。私はそれを行うことができる他の方法はありますか？

Answer 1

ここでは簡単な解決策があります。サムネールにクリックイベントを追加すると、サムネイルをクリックすると次の3つの画像がプリロードされます。

$("#content img").on("click",function(){ // use .live instead if you are using an older version of jQuery 
    var next = $(this).next(); 
    for (var i = 0; i < 3; i++) 
    { 
     var img = new Image(); 
     img.src = next.attr("alt"); 
     next = next.next(); 
    } 
}); 

Answer 2

イメージがmysqlに格納されている場合は、イメージ名のSQLクエリからjsonエンコードを追加して見つけたソリューションを使用できます。あなたが言及したソリューションを使用することができます

require_once('JSON.php'); 
    $json = new Services_JSON(); 
    $out = $json->encode($query) 

Answer 3

をプリロードするためのjQueryに情報を渡す、あなただけのギャラリーの画像のsrc属性を抽出する必要があります。

preload($('#gallery-images img').map(function() { return this.src; })); 

これは実際にプリロード関数を呼び出します必要な配列

Answer 4

..あなたは、個々のイメージのナビゲーションでは1回、次の画像をプリロードするいくつかの方法がまだかかわらず、働いたことがなければならないだろうが、うまくいけば、これはあなたがそこに着くHEPます私はこのギャラリーを使用することをお勧め - http://dimsemenov.com/plugins/royal-slider/gallery/それはまさにん必要なもの - 近くの画像をプリロードし、プリロードする量を設定することができます。しかし、商用で約10ドルのコストがかかることに注意してください。