JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />



    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<title>Dynamic Drive DHTML Scripts- Flying Butterfly script</title>

<!-- /////// SLUDE //////////////////////////////////// -->

    <script type="text/javascript" >

	    function slideUpDiv(){
		    $('#les8_ex3').slideUp();
		}
		function slideDownDiv(){
		    $('#les8_ex3').slideDown();
		}

		function slideUpDivStart(){
		    $('#les8_ex3').slideUp(0);
		}

    </script>

    <!-- ,,,,,,,,,, CSS ,,,,,,,,,,,,, -->
    <style>
		    #les8_ex3{

		    width:100%;
		    height:200px;
		    background:Palegreen;
		    border:1px solid #333366;
		    margin-bottom:20px;
		}

		.resalt{

		    background: none repeat scroll 0 0 #FFFFFF;
		    border: 1px solid #475E75;
		    margin: 10px;
		    padding: 10px;
		}
   </style>

<!-- ///////// SLUDE ///////////////////////////////// -->



</head>

<body onload="slideUpDivStart();">

<script language="JavaScript1.2">

/*
Flying Butterfly script (By [email protected])
Modified slightly/ permission granted to Dynamic Drive to feature script in archive
For full source, visit http://www.dynamicdrive.com
*/

var Ymax=8;                                //MAX # OF PIXEL STEPS IN THE "X" DIRECTION
var Xmax=8;                                //MAX # OF PIXEL STEPS IN THE "Y" DIRECTION
var Tmax=10000;                        //MAX # OF MILLISECONDS BETWEEN PARAMETER CHANGES

//FLOATING IMAGE URLS FOR EACH IMAGE. ADD OR DELETE ENTRIES. KEEP ELEMENT NUMERICAL ORDER STARTING WITH "0" !!

var floatimages=new Array();
floatimages[0]='http://img-fotki.yandex.ru/get/4704/42428604.da/0_76b87_d2d4c0a8_S';
floatimages[1]='http://img-fotki.yandex.ru/get/4704/42428604.da/0_76b87_d2d4c0a8_S';

//*********DO NOT EDIT BELOW***********
var NS4 = (navigator.appName.indexOf("Netscape")>=0 && parseFloat(navigator.appVersion) >= 4 &&...