Programación, Seo, Usabilidad y Marketing Online
Posts tagged JavaScript
Slide content sin JavaScript
Mar 19th
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;
-
}