JSFiddle - React, Tailwind, and code Playground

by rwaldron

HTML

<table>
    <colgroup>
        <col></col>
    </colgroup>
    <tr>
        <td>table data</td>
    </tr>
</table>

<div></div>

CSS

table {
    /*table-layout: fixed;*/
}

col {
    width: 300px;
}

td {
    background-color: red;
    height: 100px;

}

div {
    background-color: red;
    height: 100px;
    width: 300px;    
}

JavaScript

$("td").click(function() {
   $("col").animate({"width": 0}, 2000); 
});

$("tr,td").animate({"width": 0}, "slow", function () {
    console.log($(this), "complete")
});

$("div").animate({"width": 0}, "slow", function () {
    console.log($(this), "complete")
});