JavaScript配列show10 images then next 10

Question

私はいくつかのロジックについて助けが必要です。私は600イメージのJSonフィードを持っています。私は最初の10枚の写真を見せたい。ユーザーが10番目の画像に移動すると、配列内にさらに画像がある場合は、次の10個の画像を表示します。私はすでにjsonを微調整してわずか10枚の画像しか得られませんでしたが、配列内の次の10項目を取得する方法がわかりません。私はカウンターではなく、そのすべてが私とつながっていないことを知っている。任意の提案、pseudeoコード、リンクまたはコードが賞賛されています。

は、それはJavaスクリプトでちょうどpseudeoあります

Answer 1

ありがとうございます。ループを分析するだけです。

Jsonフィードの画像をアレイコンテナに収集するだけです。 10枚の画像を取得したら、それらを機能で表示し、コンテナをきれいにします。すべての画像が終わるまでやり続ける。 関数を再度呼び出すことによって、10未満の最後の数個のイメージを表示します。

私は正確なコードを与えることができなかったので、jsonフィード構造は現在知られています。

var jsonFeed={...}; 
var counter=0; 
var setOfTenImages=[]; 
for(i=0;i<jsonFeed.length;i++){ 
    if(counter==10){ 
    showTenImages(setOfTenImages); // call function to display Ten Images 
    setOfTenImages=[];    // clean all container of Ten images which are displayed. 
    } 
    setOfTenImages[counter++]=jsonFeed[i].image; 
} 
    showTenImages(setOfTenImages); // Last remaining few images which are less than ten. 

Answer 2

コンテンツをロードする方法は2つあります。

1. DOMを作成してすべての写真を表示し、最初だけを表示する10.残りを隠す。目に見える10番目のアイテムをヒットしたら、次の10を表示します。
2. はJSONオブジェクトへの参照は、現在あなたが水平または垂直方向にスクロールする場合は言及していない10

次の10のnショーを10日非表示を打つ上でのみ最初の10をレンダリングしてください。 あなたは、これは正確に何をしたいではないかもしれないが、あなたのアイデアを得ることができhttp://jsfiddle.net/ch4nd4n/LS7VV/4/での例を参照することができ、親持つ固定幅と巨大な幅

とターゲット画像を含む子のdivで2つのdivを作成します。あなたはonloadイベント火災や身体負荷を投稿する必要が

HTML構造

<div style="width:500px;overflow:hidden;height:255px;position:relative"> 
    <div id="images" style="width:40000px;position:absolute;"></div> 
</div>​ 

JavaScriptの一部。

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?id=60474555@N00&lang=en-us&jsoncallback=?", { 
    format: "json" 
}, function(data) { 
    var str = ""; 
    $.each(data.items, function(i, item) { 
     str += ("<img src='" + item.media.m + "'/>"); 
    }); 
    $("#images").append(str); 
    $("#images").find("img").click(function() { 
     // Add check to animate only if clicked image is not the center of parent div 
     $('#images').animate({ 
      left: '-=200' 
     }, 500); 

    }); 
});​