JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script  type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>

<script type="text/javascript">
function sizeImg(imgW, imgH)
{
    winW = $(window).width();
    winH = $(window).height();

   imgRatio = imgW / imgH;

   function scaleWB() { tWidth = winW; tHeight = tWidth / imgRatio; }
   function scaleBW() { tHeight = winH; tWidth = tHeight * imgRatio; }

   if (imgRatio >= 1)        // determination of oriontation of image
   {
      scaleWB();
      if (tHeight > winH) { scaleBW(); }
// Prevent that the displayed piucture is wider as the  jpeg file
   if (tWidth > imgW) { tWidth = imgW;  tHeight = imgH; }  
   }
   else
   {
      scaleBW();
      if (tWidth > winW) { scaleWB(); }
// Prevent that the displayed piucture is higher as the  jpeg file
      if (tHeight > imgH) { tWidth = imgW;  tHeight = imgH; }  
   }
    tLeft = (winW-tWidth)/2;
    tTop = (winH-tHeight)/2;
}

window.focus();

$(document).ready(function(){                            
    $('#slideimage').show("clip", { direction: "horizontal"},1500).delay(5000).hide("clip", { direction: "horizontal"},1500); 
});
</script>

</head>
<body>
<script type="text/javascript">
      sizeImg(967, 1000);
    document.write('<img src="http://www.andrewolff.nl/jquerytest/2011%2007%2011_0023.jpg"  id="slideimage" style="border-color: #ffffff; border-width: 0px; left: ' + tLeft + 'px; top: ' + tTop + 'px;" width="' + tWidth + '" height="' + tHeight + '" title="" alt="">');
</script> 
      
<script type="text/javascript">         
function clipEffect()
{ 
  $('#slideimage').show("clip", { direction: "horizontal"},1500).delay(5000).hide("clip", { direction: "horizontal"},1500); 
} 
function blindEffect()
{ 
  $('#slideimage').show("blind", { direction: "horizontal"},1500).delay(5000).hide("blind", { direction: "horizontal"},1500); 
}
</script>
 ...

CSS

#slideimage {
    border-style: solid;
    display:none;
    position: absolute;
}