滚动内部div

时间:2012-06-25 06:20:58

标签: javascript html scroll

我有一个固定长度的div。还有另一个可变长度的div。我想滚动内部div。但它不起作用。

<div style="width:200px">
  <div style=" overflow-x:scroll">
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
  </div>
</div>​

JS Fiddle

3 个答案:

答案 0 :(得分:2)

以下是一个示例,您需要固定的宽度和高度http://jsfiddle.net/57wdH/487/

<div style="width: 200px; overflow-x: auto; ">
    <div style="height: 70px; width: 500px">
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
        <img src="https://www.google.com.pk/images/srpr/logo11w.png" />
    </div>
</div>

风格

img{
    max-width:100px;
}

答案 1 :(得分:0)

你可以试试这个:演示:http://jsfiddle.net/epinapala/57wdH/23/

<div style="width: 150px;overflow-x:auto; ">
<div style="height: 100px; width: 500px">

您可以更改高度,使其与外部div成比例!

答案 2 :(得分:0)

这对我有用......

<div style="width:200px; height:100px; overflow: scroll; overflow-x: hidden;">
    <div style="">

...