JSFiddle - React, Tailwind, and code Playground

by arjuncc

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/black-tie/jquery-ui.css">
<div class="selector"></div>

<div class="selector2"></div>

CSS

.selector, .selector2 {
    position: relative;
    width: 100px;
    height: 100px;
    background-color: CornflowerBlue;
    float: left;
    margin-right: 10px;
}

JavaScript

$(".selector").resizable({
    resize: function(event, ui) {
        // set directly
        ui.size.height = 150;
        ui.size.width = 150;
    }
});



function restrictSize(ui) {
    maxheight = 250;
    maxwidth = 300;

    ui.size.height = ui.size.height > maxheight ? maxheight : ui.size.height;
    ui.size.width = ui.size.width > maxwidth ? maxwidth : ui.size.width;
}