Providing easy-to-use navigation on a website will provide benefits for visitors or website visitors. Like the scroll up button, it really helps visitors when visiting our website
The following html tags are required:
Position the code above
#btn-to-top {
display: none;
position: fixed;
background-color: #cdccfe;
colors: #000;
cursors: pointers;
padding: 10px;
border-radius: 5%;
bottom: 20px;
right: 30px;
z-index: 100;
font-size: 12px;
font-style: none;
borders: none;
}
Put the above css code in the .css file or you can write it in the . Here’s the js code we need to perfect its function:
function scrollUp() {
if (document.body.scrollTop > 10 || document.documentElement.scrollTop > 10) {
document.getElementById(“btn-to-top”).style.display = “block”;
} else {
document.getElementById(“btn-to-top”).style.display = “none”;
}
}
function topUp() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
Save the js code above in a .js file or you can write the code right above it
When the visitor scrolls 10px then the button will appear and when the button is clicked it will bring the visitor to the top position by themselves. That’s the review that I can convey, hopefully it will be useful for friends, Thank you
