JSFiddle - React, Tailwind, and code Playground

by Juan Muñoz

HTML

<div class='a' tittle="algo para mostrar" > Que pasa </div>

CSS

.activo{
    width: 140px;
    height: 300px;
    background-color: blue;
    -webkit-transition: all 1s ease-in;
}
.activo:hover{
    width: 440px;
    height: 300px;
    background-color: red;
    opacity: .5;
    -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */
    transform: rotate(7deg);
}
div{
    width:100px;
    height: 40px;
    background-color: green;
    -webkit-transition: all 1s ease-out;
}

JavaScript

$(document).ready(function (){
    $("div").click(function (){
        $(this).toggleClass('activo');    
    }) 
})