Как добавить полосу прокрутки в div? - PullRequest
Новая
       35

Как добавить полосу прокрутки в div?

62 голосов
/ 14 мая 2010

У меня есть всплывающее окно, отображающее некоторые результаты, и я хочу, чтобы полоса прокрутки отображалась, поскольку результаты обрезаются (и я не хочу, чтобы всплывающее окно было слишком длинным).

Ответы [ 5 ]

93 голосов
/ 14 мая 2010

Вам нужно добавить style="overflow-y:scroll;" в тег div. (Это заставит полосу прокрутки по вертикали).

Если вам нужна полоса прокрутки только при необходимости, просто наберите overflow-y:auto;

16 голосов
/ 24 октября 2012

Css класс, чтобы иметь хороший Div с прокруткой

.DivToScroll{   
    background-color: #F5F5F5;
    border: 1px solid #DDDDDD;
    border-radius: 4px 0 4px 0;
    color: #3B3C3E;
    font-size: 12px;
    font-weight: bold;
    left: -1px;
    padding: 10px 7px 5px;
}

.DivWithScroll{
    height:120px;
    overflow:scroll;
    overflow-x:hidden;
}
9 голосов
/ 29 августа 2014

Если вы хотите добавить полосу прокрутки с помощью jquery, будет работать следующее. Если у вашего div был идентификатор mydiv, вы можете использовать следующий селектор идентификаторов jquery со свойством css: 

jQuery('#mydiv').css("overflow-y", "scroll");
5 голосов
/ 14 мая 2010 
<div class="scrollingDiv">foo</div> 

div.scrollingDiv
{
   overflow:scroll;
}
3 голосов
/ 20 июня 2014 

<head>
<style>
div.scroll
{
background-color:#00FFFF;
width:40%;
height:200PX;
FLOAT: left;
margin-left: 5%;
padding: 1%;
overflow:scroll;
}


</style>
</head>

<body>



<div class="scroll">You can use the overflow property when you want to have better       control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better </div>


</body>
</html>
...