展开父格宽度以适应孩子的div，表示平滚动网站

我想提出一个水平滚动画廊风格的网站，类似这样的： http://ericryananderson.com/book_2 展开父格宽度以适应孩子的div，表示平滚动网站

我有一个父DIV，而且DIV内是孩子的div的画廊中的每件物品。

由于我不知道画廊中会有多少物品/会随时间而改变，我如何自动制作父级尺寸以使画廊物品保持在同一条线上，从而允许内容溢出屏幕的宽度，再次像我在上面引用的网站。

它目前只表现我想要的方式，如果我手动设置宽度。

HTML：

<div class="parent-gallery-div"> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    ... 
</div>

CSS：

.parent-gallery-div { 
    height: 500px; 
    float: left; 
    margin-top: 40px; 
} 

.gallery-item { 
    height: 420px; 
    float: left; 
    margin-right: 20px 
}

来源

2011-12-02 user1077937

尝试使用JScrollPane的插件http://jscrollpane.kelvinluck.com/ 这里实现，这是一个例子： http://longinstudio.pl/realizacje/reklama%20zewnetrzna

用法相对简单，看起来好于http://ericryananderson.com解决方案。（f.e有可能控制滚动外观和动画效果）

来源

2011-12-02 18:04:10

我自己的网站，我的工作比例如更好，更简单，功能更强大我给，并且你可以用鼠标滚轮水平地滚动它。对不起，我不认为我需要使用jQuery来实现我想要的，CSS应该能够处理它。 http://www.lethalmonk6.byethost24.com/seamscape.html – user1077937

如果你想增加高度为自动。

试试这个代码

<div class="parent-gallery-div"> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    <div class="gallery-item"></div> 
    ... 
    <div style="clear:both;"></div> 
</div>

，并删除height属性为“父画廊-DIV”

来源

2011-12-03 05:44:19

我希望高度保持不变，并且内容在同一行上水平延续，因此为什么我需要动态扩展div宽度。这是否做到这一点？ – user1077937

展开父格宽度以适应孩子的div，表示平滚动网站

回答

相关问题