que he visto este hecho en algunos sitios, un ejemplo es artofadambetts.com. La barra de desplazamiento en la página desplaza solo un elemento de la página, no toda la página. Miré la fuente y aún no he podido descifrarlo. ¿Cómo se hace esto?¿Cómo configurar la barra de desplazamiento del navegador para desplazar parte de una página?
Eso es bastante ingenioso. Utiliza "posición: fija" en la mayoría de los divs, y el que se desplaza es el que no lo tiene.
Para poner barras de desplazamiento de un elemento como un div:
<div style="overflow-x: auto; overflow-y: auto;>the content</div>
Si sólo desea una barra de desplazamiento horizontal o vertical, sólo utilizan cualquiera de desbordamiento-x y el desbordamiento-y lo que necesita.
Para un div, se pueden añadir en el CSS
overflow: auto
Por ejemplo,
<div style="overflow:auto; height: 500px">Some really long text</div>
Editar: Después de buscar en el sitio informados, es probable que no quiere esto. Lo que hace en su sitio web es hacer el diseño como fijo (posición: fijo) y le asigna un índice z más alto que el texto, que es un índice Z más bajo.
Por ejemplo:
<div class="highz"> //Put random stuff here. it'll be fixed </div> <div class="lowz"> Put stuff here you want to scroll and position it.</div>
con el archivo css
div.highz {position: fixed; z-index: 2;}
div.lowz {position: fixed; z-index: 1;}
Esto se puede hacer en CSS usando la "posición: absolute;" cláusula
He aquí un ejemplo de plantilla:
El navegador es el desplazamiento de la página, es sólo que parte de ella se fija en su posición.
Esto se hace mediante el uso de la "posición: fijo" propiedad CSS en la parte que no desea para desplazarse.
Han instalado el lateral y superior a los elementos tienen posiciones fijas a través de CSS (véase la línea 94 de su archivo style.css). Esto los mantiene en la ventana gráfica mientras el resto se desplaza.
De hecho, no es la parte de desplazamiento que está "haciendo el trabajo", que es la parte fija de la página.
Con el fin de hacer esto, usted debe utilizar CSS y añadir position: fixed; propiedad (utilizarlo con top, bottom, left y/o propiedades right) a los elementos que desea no para desplazarse.
Y no debe olvidar darles un mayor z-index; si no, puede que exista algún elemento de desplazamiento que pueda pasar por su elemento fijo mientras se desplaza (y ciertamente no desea eso).
para averiguar cómo la gente hace este tipo de cosas en CSS y/o JavaScript Firebug herramienta es simplemente excepcional:
Hay que señalar que sin further hacks posición fija no funciona para IE6 , que todavía se las arregla para mantener el 15-30% del mercado, dependiendo de su sitio.
Puede usar posicionamiento fijo o absoluto para unir varios elementos a posiciones fijas en la página. Alternativamente, puede especificar un elemento de tamaño fijo (como un DIV) y usar overflow: scroll para forzar las barras de desplazamiento sobre eso.
Como ya se mencionó, hacer que todo funcione en Internet Explorer Y Firefox/Opera/Safari requiere un uso juicioso de los hacks.
probar esto por el desplazamiento de una parte determinada de la página web ......
<html>
<head>
<title>Separately Scrolled Area Demo</title>
</head>
<body>
<div style="width: 100px; border-style: solid">
<div style="overflow: auto; width: 100px; height: 100px">
sumit..................
amit...................
mrinal.................
nitesh................
maneesh................
raghav...................
hitesh...................
deshpande................
sidarth....................
mayank.....................
santanu....................
sahil......................
malhan.....................
rajib.....................
</div>
</div>
</body>
</html>
Buen punto. El sitio no funciona en IE 6. – airportyh