Easy Accordion
Easy Accordion Plugin es un plugin jQuery muy sencillo y gratuito para mostrar contenido deslizante en un accordeon horizontal. Es muy sencillo de implementar y muy versátil, porque además de ser altamente configurable y personalizable, permite mostrar todo tipo de contenido.
Principales características:
- Es fácil de implementar y ofrece un efecto de deslizamiento suave que se ve muy atractivo.
- Permite configurar si se activa automáticamente o no.
- También permite insertar varias instancias en una misma página.
- Opción para seleccionar el slide que se mostrará por defecto.
- Permite rotar textos usando propiedades CSS.
- Personaliación por medio de CSS.
- Es una solución que incorpora accesibilidad y tiene en mente el SEO.
- Algo muy importante es que permite incluir todo tipo de contenido en el slide.
- Ocupa menos de 8KB.
- No depende de ningún otro componente.
Para añadirlo a tu Web necesitaras incorporar en tu página los estilos necesarios, la librería jQuery, el plugin easyAccordion y su llamada.
<link rel="stylesheet" href="styles.css">
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript" src="easyAccordion.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#accordion-1').easyAccordion();
});
</script>
Y en el <body>:
<div id="accordion-1">
<dl class="easy-accordion">
<dt>First slide<span style="bottom: 0px;">01</span></dt>
<dd><h2>This is the first slide</h2><p><img alt="Alt text to go here" src="images/monsters/img1.png">Texto<br><a href="#">Read more</a></p></dd>
...
</dl>
</div>
Puedes añadir tantos elementos como quieras a la lista de definiciones pero posiblemente tengas que adaptar el estilo CSS.
Los estilos son totalmente configurables a través de la hoja de estilos CSS.
Este plugin también nos permite ejecutar las iteraciones automáticamente cada x segundos:
$('#accordion-1').easyAccordion({
autoStart: true,
slideInterval: 5000
});
Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
¿Buscas trabajo de programador?
11 artículos que te podrían interesar
Ver más sobre
Deja una respuesta