JSFiddle - React, Tailwind, and code Playground

by Nick Hulea

JavaScript

var paper = Raphael(0, 0, 300, 300),
    circle = paper.circle(150, 150, 50);
text = paper.text(150, 150, "Services");


circle.attr({
    'stroke': '#f00',
        'stroke-width': 4,
        'fill': 'red'
});
text.attr({
    'fill': '#fff',
    'stroke': '#fff',
    'font-size': '20'
});
circle.hover(function () {
    this.animate({
        r: 100,
    }, 1000, 'super_elastic');
}, function () {
    this.animate({
        r: 50
    }, 1000, 'super_elastic');
});

// modify this function
Raphael.easing_formulas.super_elastic = function (n) {
    if (n == !! n) {
        return n;
    }
    return Math.pow(2, -10 * n) * Math.sin((n - .075) * (2 * Math.PI) / .3) + 1;
};