javascript - ajax を画面外にプリロードする方法

Question

私はこれをやろうとしています。

8 つの画像が 1 つずつ渡されるスライダーがあります。[次へ] または [前へ] ボタンをクリックすると、8 つの新しい画像が渡されます。（すべての画像は私のindex.phpで宣言されています）そう：

画面から (DataBase から) 8 つの画像 (左側に 4 つ、右側に 4 つ) をプリロードする必要があり、[次へ] または [前へ] ボタンをクリックすると、各グループが通過します。

すべての画像をロードしないためにこれを行う必要があります（200以上になります）。

私が持っているコードはこれです：

<script type="text/javascript">
$(document).ready(function() {
   $("#foo1").carouFredSel({
       items    : 8,
       direction : "left",
       width : "100%",
       scroll : {
          items : 1,
          easing : "swing",
          duration : 300
       }                    
    }); 

    $("#foo1_next").click(function() {
        $("#foo1").trigger("next", 4);
    });

    $("#foo1_prev").click(function() {
        $("#foo1").trigger("prev", 4);
    });
});
</script>

どうもありがとう。