动态内容溢出父div jquery

时间:2014-01-09 05:09:47

标签: jquery scroll

我为我的问题准备了一个不错的JFiddle。有一个按钮,允许您向div添加元素。我希望div在溢出时在其垂直轴上添加一个滚动条,而不是只是继续向下移动到屏幕上。

HTML

<button>Add</button>

<div id="foo">

</div>

CSS

p{display:inline;}
#foo{
background:#456;
height:200px;
width:100%
}

JS

$(document).ready(function(){

    ii = 1

    $("button").click(function(){

            $("#foo").append("<div>"+ii+"&nbsp;&nbsp;<p class='remove'>Remove</p></div>")
            ii++

    })

    $("div").on("click","p",function(){$(this).parent().remove()});


})

http://jsfiddle.net/25kwG/4/

1 个答案:

答案 0 :(得分:2)

添加overflow:scroll

#foo{
  background:#456;
  height:200px;
  width:100%;
  overflow:scroll;
}

演示----> http://jsfiddle.net/25kwG/5/