Programación, Seo, Usabilidad y Marketing Online
Slide content sin JavaScript
Navegando por la nube encontré un Slide Content, que funciona sin necesidad JavaScript, esto es posible gracias a Css y Html.
Para realizar este Slide Content, se debe usar la propiedad CSS, overflow, el cual es soportado por navegadores como: Internet explorer, Mozilla, Opera, Chrome y Safari.
El código Html esta compuesto por uls y divs, que hacen posible que Slide Content funcione:
HTML:
Y este es el código CSS necesario para hacer funcionar este Slide content
CSS:
-
#content-slider {
-
width: 650px;
-
overflow: hidden;
-
height: 300px;
-
}
-
-
#content-slider-inside {
-
list-style: none;
-
height: 320px; // these 3 lines
-
overflow: scroll; // help Opera
-
overflow-y: hidden; // behave
-
}
-
-
#content-slider-inside li {
-
width: 650px;
-
height: 300px;
-
}
| Print article | This entry was posted by miguelsumaran on March 19, 2010 at 10:54 pm, and is filed under Programación. Follow any responses to this post through RSS 2.0. You can leave a response or trackback from your own site. |