- Plantillas Web
- Plantillas E-commerce
- Plantillas de CMS y Blog
- Plantillas Facebook
- Constructor Web
Slider “Coin”
noviembre 15, 2010
Este es un script de Slider que puede cortar automáticamente imágenes para crear diferentes efectos de transición. Usted puede encontrar las instrucciones completas de instalación y de configuración siguiendo este enlace.
JavaScript
Para que el script funcione, el fichero index-#.html con slider debe contener estas líneas de código HTML para incluir el script coin-slider.js y jQuery framework:
La sección <head> del fichero index-#.html contiene estas líneas de código que inicializan la funcionalidad de script con los valores básicos:
El script comienza con el elemento <div> con id de #coin-slider. Los atributos de script definen los siguientes valores:
• width: 565 – anchura del panel de slider;
• height: 290 –altura del panel de slider;
• spw: 7 – cuadros por anchura;
• sph: 5 – cuadros por altura;
• delay: 3000 – pausa entre imágenes en ms;
• sDelay: 30 – pausa entre cuadros en ms;
• opacity: 0.7 – opacidad de título y de navegación;
• titleSpeed: 500 – velocidad de aparición del título en ms;
• effect: ‘ ‘ – efecto de transición, random por defecto (random, swirl, rain, straight);
• navigation: true – prev/next y botones;
• links : true – mostrar imágenes como enlaces;
• hoverPause: true – pausa al permanecer inmóvil.
HTML
Ahora se puede revisar una representación de script HTML:
Cada slide es una imagen (etiqueta <img>), colocada en un enlace (etiqueta <a>). También puede agregar una descripción de slide usando el elemento <span>. CSS
Usted puede encontrar stylesheet relacionado con script en el fichero style.css principal. Usted tendrá que modificar los siguientes estilos: