JSFiddle - React, Tailwind, and code Playground

by afshinprofe

HTML

<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>

<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>

<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<p>Hello</p>
<div class="show"> Hollow Box </div>

CSS

.show{
   position:absolute;
    right:0;
    width:100px;
    height:100px;
    display:none;
    top:90%;
background: -webkit-linear-gradient(center top , #CAF579, #73CA08) repeat scroll 0 0 transparent;
}

JavaScript

$(window).scroll(function(){
   $('.show').fadeIn();

});