JSFiddle - React, Tailwind, and code Playground

by abdallha dagga

HTML

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=1.7.2'></script>
<script type="text/javascript">
jQuery(document).ready(function() {jQuery(".tehtbox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-235"}, "medium");}, 400);});
</script>
<style>
.tehtbox{background:url(http://upload.wikimedia.org/wikipedia/commons/thumb/8/82/Nuvola_mimetypes_info.png/100px-Nuvola_mimetypes_info.png) no-repeat scroll left center transparent!important;float:right;height:250px;width:230px;z-index:99999;position:fixed;right:-235px;top:20%;padding:0 5px 0 40px}
.tehtbox div{margin-right:-8px;border:3px solid #00bef6;background:#fafafa;padding:0}
.tehtbox a{font-size:10px;margin-left:40px}
</style>
<div class="tehtbox">
<script type="text/javascript" src="http://s.moopz.com/fanbox_init.js"></script>
<!-- start Usertalk -->
<script>
  

   (function(i,s,o,g,r,a,m){i[&#39;UsertalkObject&#39;]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,&#39;script&#39;,&#39;https://www.getusertalk.com/usertalk.js&#39;,&#39;_ut&#39;);
  


   _ut(&#39;app_key&#39;, &#39;7657611c03cea6cb085f6e934e5aa0d8&#39;);
  

   _ut(&#39;locale&#39;, &#39;ar&#39;);
  
   </script><br/>
<div id='abuiyadblog'>
<button onclick='javascript:usertalk.call();'><img border='0' src='http://4.bp.blogspot.com/-5UQBX7BGaQQ/U4Oi1vW7nrI/AAAAAAAAJNQ/7NXT6qMUjBQ/s1600/user-talk.png'/></button>

</div>
</div>