Ver Mensaje Individual
  #4 (permalink)  
Antiguo 21/04/2009, 11:36
kseso?
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 11 meses
Puntos: 539
Respuesta: Camuflar scroll bar con CSS

Me pudo la curiosidad y aquí va el código para "tapar la guía" del scroll:
Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es">
  3. <title>ocultar scroll</title>
  4.  
  5. <style type="text/css">
  6. * {margin: 0; border: 0; padding: 0;}
  7. body {background: #fff;}
  8. #contenedor {width: 200px; height: 200px; overflow: auto;}
  9. #tapa {position: absolute; width: 20px; height:166px; left: 183px; top: 17px; background:#fff;}
  10. p {color: #000}
  11.  
  12. </head>
  13. <div id="contenedor">
  14. <p><p>Lorem ipsum dolor sit amet consectetuer nunc convallis nunc nulla tincidunt. Id Curabitur gravida ac senectus condimentum Phasellus Aliquam condimentum ante nibh. Nullam condimentum nunc commodo elit dolor urna metus Fusce ipsum volutpat. Rhoncus metus Curabitur et laoreet Phasellus tempus dignissim est pellentesque adipiscing. Eget suscipit magna pretium facilisi justo Curabitur sit mattis sit eget. Dictumst Maecenas et.</p>
  15. <p>Vel Vestibulum Duis congue laoreet vestibulum elit quis aliquam tincidunt in. Pellentesque dui a turpis pellentesque sed Vestibulum vitae nibh nibh adipiscing. Nec a Vivamus velit consectetuer wisi nibh et Donec eros magna. Quisque dui semper Nunc laoreet Vestibulum vitae sit Nam enim laoreet. Wisi Vestibulum auctor id Sed est et turpis sociis fringilla at. Nunc penatibus pede et Morbi tortor justo.</p>
  16. <p>Et non sit Aenean dictum risus pretium tortor nulla amet sed. Id parturient quis Sed vitae risus ridiculus pretium Integer interdum volutpat. Lorem Cras est molestie in tortor vitae sociis interdum libero justo. Integer Nulla Donec ipsum tristique Morbi urna pede a malesuada Phasellus. Dui justo magna nibh molestie laoreet ullamcorper semper Suspendisse et Praesent. Suspendisse Ut ornare felis ultrices tristique a sapien et sed ac. Magnis hac.</p>
  17. <p>Mauris dolor sit est sem justo tortor Phasellus ac eros libero. Nascetur semper Sed ipsum Pellentesque ut laoreet wisi Integer adipiscing eros. Vestibulum ligula eu suscipit neque lacus accumsan In Quisque ligula Aliquam. Id lacinia Mauris lacus fringilla eros facilisi sapien tristique tempor pede. Tempor Vestibulum auctor nonummy augue ut Vestibulum interdum sed eu Pellentesque. Id platea pretium semper Nunc dolor Nunc Aenean sit Proin et. </p>
  18. </p>
  19. </div>
  20. <div id="tapa"></div>
  21. </body>
  22. </html>

y este es el resultado en opera 9, FF 3 e IE 7:


Pero otra cosa es que sea práctico y funcional en otras situaciones.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++