子が見えなくなったときに固定高さと幅のスクロールを水平にスクロールするにはどうすればいいですか？

Question

私はユーザーが作成した要素を格納するカートの種類を作成する必要があります。 私はあなたが私のニーズを理解するための簡単なスキームを作成しました：

.buttonsは、私は要素をスクロールするonclickイベントをバインドします画像（矢印）、（#scroller）を含む2つのdivです。レイアウトにはサイズが固定されているため、正確な長さはul#scroller（項目を含み、スクロールする必要がある要素）は900pxです。 #scroller子<li>のサイズは〜100pxになると思います。

ユーザーが#scrollerアイテムにアイテムを保存できるボタンがあります（スキームには表示されません）。

実際にアイテムが多すぎる場合、次の行が下に移動します（新しい行が始まります）。代わりに、新しい要素が同じ行に表示されるようにしたいと思いますが、非表示にします（ヒットしないで#button_right）。

私はJavaScriptでこれを行い、要素を配列に格納し、最初の9個（x 100ピクセル）しか表示しないようにしてから、矢印をクリックして（最初のアイテムを隠す）最初のアイテムを非表示にし、 10日を示す。

これは良い解決策だと思いますか？

もしそうでなければ、何をお勧めしますか？どのようなCSSルールが私の手助けになるのでしょうか？

ありがとうございます。

Answer 1

非常に長い幅の余分なdivを作成し、#scrollerに入れて#scrollerにoverflow: hiddenとすると、スクロールバーが表示されません。このような

：

HTML：

<div id="scroller"> 
    <div id="inner"> 

     (your items) 

    </div> 
</div> 

CSS：

#scroller { 
    width: 900px; 
    overflow: hidden; 
} 

#inner { 
    width: 90000px; 
} 

P.S.アイテムは別のの行には移動しませんが、アイテムの数に応じてコンテンツをスクロールするようにボタンをコーディングする必要があります。