JSFiddle - React, Tailwind, and code Playground

by JAAulde

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css">
<div id="live">
    <ul>
        <li>
            <a href="#tabOne">Tab One</a>
        </li>
        <li>
            <a href="#tabTwo">Tab Two</a>
        </li>
    </ul>
    <div id="tabOne">
        <p class="dragme">Drag me</p>
        <p class="dragme">Or, drag me</p>
    </div>
    <div id="tabTwo">
        <p>Some Tab Two Content</p>
    </div>
</div>

JavaScript

$( '#live' )
    .tabs();

$( '.dragme' )
    .draggable( {
        helper: 'clone',
        scroll: true,
        revert: 'invalid',
        revertDuration: 250,
        opacity: 0.6,
        greedy: true,
        cursorAt: { top : 5 }
      } );