JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="myDiv"></div>
</div>
<div id="buttons">
<button id="pin">Pin</button>
<button id="unpin">unPin</button>
</div>
CSS
#container {
height: 2000px;
}
#buttons {
position: fixed;
top: 0px;
right: 200px;
}
#myDiv {
margin-top: 50px;
width: 100px;
height: 50px;
background-color: #88a;
}
JavaScript
var pin = document.getElementById('pin');
var unpin = document.getElementById('unpin');
var myDiv = document.getElementById('myDiv');
pin.addEventListener('click', function () {
myDiv.style.position = 'fixed';
});
unpin.addEventListener('click', function () {
myDiv.style.position = 'block';
});