jQuery Iluminate

jQuery Illuminate es un plugin que nos permite aplicar un efecto glow y un cambio de colores a nuestros botones web. Se puede graduar la intensidad del efecto, el tamaño del glow y la velocidad de “parpadeo” de Illuminate, entre otros parámetros.

Para utilizar el plugin deberás descargarte el plugin y añadirlo en tu <head> junto con la librería jQuery.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script src="jquery.illuminate.0.7.min.js" type="text/javascript"></script>

Añadir el elemento que quieres iluminar en la parte que desees de tu <body>:

<div id="button">Click Me</div>

Y ya solo falta añadir antes de la etiqueta de cierre </body> la llamada al plugin:

<script type="text/javascript">
$(document).ready(function() {    
    $('#button').illuminate({
        'intensity': '0.3',
        'color': '#98cb00',
        'blink': 'true',
        'blinkSpeed': '1200',
        'outerGlow': 'true',
        'outerGlowSize': '30px',
        'outerGlowColor': '#98cb00'
    });
});
</script>

Desafortunadamente no funciona en Mozilla Firefox.

Ver ejemplo en funcionamiento

Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Te ha servido? Valora esta entrada!
(1 votos, promedio: 3 de 5)
Comparte en las redes sociales
¿Buscas trabajo de programador?

Una respuesta a “jQuery Iluminate”

  1. piero dice:

    una consulta por favor, como haria para controlar el illuminate, osea, controlar cuando deje de brillar y luego continue con un click o algo asi

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ver más sobre