Blogs Media: CSS Mania | VivirLatino | Sentido Web | Apps Mania

Publicidad

Jue12Jun2008

Flashing de elementos con Mootools

09:30 H (CET)| Temas: Javascript

Una librería para MooTools que permite realizar flash en los elementos. Permite indicar el color de origen, final, el número de repeticiones y el tiempo del efecto y la posibilidad de incluir propiedades al elemento (por ejemplo backgroud-color).

Su uso es sencillo y nos ofrece ejemplos de cómo utilizarlo:

/* flash on click */  
$('flash-link').addEvent('click', function () {  
  $('flash-me').flash('#fff','#fffea1',5,'background-color',500);  
});  
/* flash on ajax complete */  
$('flash-link-ajax').addEvent('click', function () {  
  //make the ajax call  
  var req = new Request({  
    method: 'get',  
    url: 'element-flashing.php',  
    data: { 'do' : '1' },  
    onRequest: function() {  },  
    onComplete: function(response) {  
      $('flash-me-ajax').set('text', response).flash('#fff','#fffea1',5,'background-color',500);   
    }  
  }).send();  
});  
/* flash on scroll completion */  
$('flash-link-scroll').addEvent('click', function() {  
  var scroller = new Fx.Scroll(window, {  
    onComplete: function() {  
      $('scroll-to-me').flash('#fff','#fffea1',10);  
    }  
  }).toElement('scroll-to-me');  
});

Eso sí, no olvidar que no hay que abusar de este efecto.

MooTools Gone Wild: Element Flashing

Vía / CSS Globe

Relacionados