ユーザーが任意の数の画像をアップロードできるレスポンシブ スライド ショーを開発しています。アプリケーションは、任意のデバイスに適合するスライド ショーを動的に生成します。今ここで直面している問題があります
<section id="container">
<article id="slider">
<div id="item"><img src="img/image-1.jpg" alt="" /></div>
<div id="item"><img src="img/image-2.jpg" alt="" /></div>
<div id="item"><img src="img/image-3.jpg" alt="" /></div>
<div id="item"><img src="img/image-4.jpg" alt="" /></div>
<div id="item"><img src="img/image-3.jpg" alt="" /></div>
<div id="item"><img src="img/image-4.jpg" alt="" /></div>
</article>
<article id="nav">
<div id="prev" onclick="prev();"><img src="img/prev.png" alt="" /></div>
<div id="next" onclick="next();"><img src="img/next.png" alt="" /></div>
</article>
</section>
上記の Html コードは、私の Java コードによって生成されます。ここで、ユーザーは 5 つの画像をアップロードしました。これで、各画像は 300 ピクセルの固定を占有します。したがって、合計幅は 5*300+5*パディングになります。これで、ほとんどの通常のスライド ショーで見られるように、コンテナの幅を Java コードで動的に設定して、すべての画像を 1 行に収め、940 ピクセルを超える画像を非表示にすることができます。インライン div を縮小するシュリンク ラッピングのような css ソリューションがあるかどうかを知りたいのですが、ここではコンテナを拡張したいと考えています。
よろしく、
マクリーン