JSFiddle - React, Tailwind, and code Playground

by cordesmj

HTML

<div id="rects"></div>

JavaScript

var R = Raphael('rects', 600, 500);

var i=0;
var y=10; 

for (i=0;i<=5;i++){
    
    var set = R.set();
    var x=10;
    for (n=0;n<=9;n++){
        var rectangle = R.rect(x,y,50,50);
        set.push(rectangle);
        x = x + 60;
    }
    
    function getHoverHandler(fillColor) {
         var cSet = set;
         
         return function(){
              cSet.animate({fill: fillColor}, 300);
          };
    }
    
    set.hover(getHoverHandler('#000'),
              getHoverHandler('#FFF'));
    
    y = y + 60;
}