JSFiddle - React, Tailwind, and code Playground

by shruti patil

HTML

<div id="time">
    <p>You can see this if you click</p>
</div>

CSS

#time {
background:#ddd;
width:30px;
height:80px;
white-space:nowrap;
overflow:hidden;
cursor:pointer;
}


#time p{margin-left:35px;}

JavaScript

var count = 0;
$("#time").click(function() {
    count++;
    var isEven = function(someNumber) {
        return (someNumber % 2 === 0) ? true : false;
    };
    if (isEven(count) === false) {
        $(this).animate({
            width: "260px"
        }, 1500);
    } else if (isEven(count) === true) {
        $(this).animate({
            width: "30px"
        }, 1500);
    }
});