JSFiddle - React, Tailwind, and code Playground

by Ronny

HTML

<p>Hi</p>

CSS

p {width: 90%; height: 300px; background: #EEE; border: 2px solid cyan;}

JavaScript

var t;
$$('p').addEvents({
    'mouseenter': function() {

        t = setTimeout(function(){
            console.log('hi');
            var el = $(document.body);
            el.set('tween', {
                duration: 'long'
            });
            el.tween('color', '#FC0');
        }, 1200);
    },
    'mouseleave': function(){
        clearTimeout(t);
        console.log('bye');
    }
});