0

シンプルなスライダーを作成しようとしているので、スライドする必要があるアイテムを保持するために div (#container) を使用しています (この div には、overflow:hidden があります)、移動したい div (#slider)すべてのアイテムが一緒に移動し、スライダーに収まる div になるようにします。

float:left を使用して、すべての項目が同じ行に収まるまで、スライダーの幅を広げたいと考えています。

私はこの jsFiddle を持っています: http://jsfiddle.net/rBFPL/5/そして、同じ行に赤い div を作成し、シアンの div を幅を広げるには、助けが必要です。

これで私を助けてもらえますか？

4

2 に答える 2

1

更新: http://jsfiddle.net/HCYPD/3/

#container {
    width : 400px;
    height : 200px;
    position : relative;
    background : yellow;
    overflow: hidden;
}

#slider {
    margin : 5px;
    position : absolute;
    background : cyan;
    width: auto;
    height : 190px;
    white-space: nowrap;
}

#slider div {
    margin : 20px;
    width: 100px;
    height: 150px;
    position : relative;
    display: inline-block;
    background : red;
}
于 2012-09-22T11:19:52.803 に答える
0

私はこのjsFiddleを作成しました。あなたの言うとおりだと思います。クロムでのみテストしました。

更新：2回目の試み 

#container {
    background : yellow;
    padding: 5px;
    white-space: nowrap;
    overflow: hidden;
    position : fixed;
    width : 400px;
}
#slider {
    background : cyan;
    position : fixed;
}
#slider div {
    margin : 20px;
    width: 100px;
    height: 150px;
    position : relative;
    float : left;
    background : red;
}
于 2012-09-22T11:39:25.020 に答える