JSFiddle - React, Tailwind, and code Playground

by oilvier

HTML

<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<div class="first hidden"></div>


<div class="test hidden"></div>

CSS

div {   width: 100px;
        height: 100px;
        background-color: #ccc;
    }
    .hidden {
        width: 456px;
        opacity: 0;
    }
    .visible {
        width:200px;
    opacity:1;
    }

JavaScript

$(function() {

    $('.first').switchClass( "hidden", "visible", 1000, "easeInOutQuad" );

    var ok = {width:200,
             opacity:1}
    $('.test').animate(ok, 1000).removeClass('active');

  });