JSFiddle - React, Tailwind, and code Playground
by Paul Leech
HTML
<div id="main"></div>
<div id="theFixed"></div>
CSS
html { font-family:sans-serif;font-size:0.75em; }
#main { width:80%; }
#theFixed {
position:fixed;
top:250px;
right:0;
background-color:#eeeeee;
width:75px;
height:auto;
padding:3px;
margin:3px;
}
JavaScript
filler = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci fugiat cumque facilis iste, saepe itaque reprehenderit esse, nemo excepturi sunt porro inventore consectetur earum quisquam consequatur! Delectus, nemo? Quidem, repellendus.<br /><br />";
$(window).scroll(function(){
$("#theFixed").css("margin-top",Math.max(-250,0-$(this).scrollTop()));
});
$('#theFixed').html(filler);
var filled = "";
var i = 0;
while (i < 25) {
filled += filler;
i++;
}
$('#main').html(filled);