- Plantillas Web
- Plantillas E-commerce
- Plantillas de CMS y Blog
- Plantillas Facebook
- Constructor Web
FAQs
General Tutorials
MonsterONE Subscrioption
Slider “Faded” (con efecto de desvanecimiento)
noviembre 15, 2010
Este es un script de Slider que utiliza el efecto de desvanecimiento para el efecto de transición de cambio de slides. Este Slider puede ser utilizado no sólo para imágenes, pero también para diferentes bloques de contenido. 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 jquery.faded.js y jQuery framework:
Ahora se puede revisar una representación de script HTML:
CSS
Usted puede encontrar stylesheet relacionado con script en el fichero style.css principal. Usted tendrá que modificar los siguientes estilos:
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 jquery.faded.js y jQuery framework:
La sección <head> (o la sección justo antes de la etiqueta de cierre </body> ) 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 #faded. Los atributos de script definen los siguientes valores:
• speed: 300 – ajusta la velocidad de animación;
• crossfade: false – contenido de crossfades;
• bigtarget: false – haga clic en el contenido para el siguiente;
• loading: false – sólo para imágenes, comprueba si la primera imagen se carga antes de mostrarla;
• autoheight: false – ajuste automático de altura;
• pagination: “pagination” – utilice true y nombre de clase para paginación; utilice false para desactivar esta función;
• autopagination: true – configurado como true para generar paginación automáticamente;
• nextbtn: “next” – clase de botón ‘siguiente’;
• prevbtn: “prev” – clase de botón ‘antecedente’;
• loadingimg: false – localización de imagen que se carga (por ejemplo, /img/loading.gif) si se utiliza la carga;
• autoplay: false – la reproducción automática de contenido (configurado con el número positivo para true, también ajusta el intervalo de tiempo (utilice 1000 para 1 segundo);
• autorestart: false – reinicio automático si la reproducción automática termina (configurado con el número positivo para true); también ajusta el intervalo de tiempo (utilice 1000 para 1 segundo);
• random: false – se utiliza truepara mostrar slides al azar.
HTML
Abajo puede revisar la representación del script HTML para imágenes:
Para añadir un slide sólo tendrá que añadir una imagen (etiqueta <img>):
Ahora se puede revisar una representación de script HTML:
Para añadir un slide sólo necesita agregar un elemento a la lista con viñetas (etiqueta <li>):
CSS
Usted puede encontrar stylesheet relacionado con script en el fichero style.css principal. Usted tendrá que modificar los siguientes estilos:
