css - personalizar - ¿Cómo agregar una barra de desplazamiento a un div?
personalizar la barra de scroll (5)
Clase css para tener un div divido con scroll.
.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;
}
Tengo una ventana emergente que muestra algunos resultados, y quiero que se muestre una barra de desplazamiento ya que los resultados se están cortando (y no quiero que la ventana emergente sea demasiado larga).
Si desea agregar una barra de desplazamiento utilizando jquery, funcionará lo siguiente. Si su div tenía un id de ''mydiv'', podría usar el siguiente selector de id de jquery con la propiedad css:
jQuery(''#mydiv'').css("overflow-y", "scroll");
Debe agregar style="overflow-y:scroll;" a la etiqueta div. (Esto forzará una barra de desplazamiento en la vertical).
Si solo desea una barra de desplazamiento cuando sea necesario, simplemente haga overflow-y:auto;
<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>
<div class="scrollingDiv">foo</div>
div.scrollingDiv
{
overflow:scroll;
}