JSFiddle - React, Tailwind, and code Playground
by jimmyw404
HTML
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<style>
.boxStyle{
border:1px solid #000;
margin-bottom: 5px;
}
.rightBoxStyle{
height:200px;
width:100px;
border:1px solid #000;
position:absolute;
right:0px;
}
.centerBox{
height:200px;
border:1px solid #000;
margin-right: 107px;
}
</style>
<script type="text/javascript">
function select()
{
$("button[type=button]").attr("disabled", "disabled");
var moveMeBox = document.getElementById("moveMe");
var centerBox = document.getElementById("center");
var newWidth = $('#center').width() - 2;
var oldWidth = $('#right').width() - 2;
var centerRightMargin = (parseInt($('#center').css('margin-right')) - $('#right').width());
var rightChild = 0;
var centerChild = 0;
/* returns original dom position for returning element to right list */
var origIndex = 0;
$('.rightBoxStyle div').each(function(index)
{
if($(this).attr('id') == 'moveMe')
origIndex = index;
});
console.log(origIndex);
if(moveMeBox.parentElement == centerBox)
{
var newLeft = newWidth + centerRightMargin;
var boxCountDifference = 2;
var marginSize = 7;
var newTop = boxCountDifference * ($('#someStaticBox').height() + marginSize);
...