JSFiddle - React, Tailwind, and code Playground

by el_chief

HTML

<link rel="stylesheet" href="//extjs.cachefly.net/ext-4.1.0-gpl/resources/css/ext-all-gray.css" />

<div id=list>
    <img id=i1 src="http://thechive.files.wordpress.com/2011/07/cleavage-heaven-boobs-27.jpg?w=500&h=686"/>
    <img id=i2 src="http://thechive.files.wordpress.com/2011/07/cleavage-heaven-boobs-27.jpg?w=500&h=686"/>
    <img id=i3 src="http://thechive.files.wordpress.com/2011/07/cleavage-heaven-boobs-27.jpg?w=500&h=686"/>
</div>

CSS

img {
width:100px;
}

#list{
border:1px solid purple
}

JavaScript

Ext.application({
    launch: function() {        
        
        var dd1 = new Ext.dd.DD('i1', 'group1');
        
     
        /*       dd1.b4MouseDown = function(){ console.log('b4mousedown', this, arguments); };
        
        
        dd1.b4Drag = function(){ console.log('b4drag', this, arguments); };;
        
        
        dd1.startDrag = function(){ console.log('startdrag', this, arguments); };;
        
        
        dd1.onDrag = function(){ console.log('ondrag', this, arguments); };;
        
        
        dd1.onDragEnter = function(){ console.log('ondragenter', this, arguments); };;
        
        dd1.onDragOver = function(){ console.log('ondragover', this, arguments); };;
        

        dd1.onDragOut = function(){ console.log('ondragout', this, arguments); };;
        

        dd1.onDragDrop = function(){ console.log('ondragdrop', this, arguments); };;
        
        
        dd1.endDrag = function(){ console.log('enddrag', this, arguments); };
        

        dd1.onInvalidDrop = function(){ console.log('oninvaliddrop', this, arguments); };

        */        
           
        
        var dd2 = new Ext.dd.DD('i2', 'group1');

        var ddt = new Ext.dd.DDTarget('list', 'group1');
    }
});