« Tagasi

Tagasi üles nupp

Lisaks veebisisu kuva sisse ankruga lisatud "Tagasi üles" nupule on võimalik lisada ka veebilehe alla paremasse serva nupp, mis on seal kogu aeg nähtaval ja millele klikates jõuab tagasi veebilehe algusesse.

Näidis on selle sama veebilehe juures, kui olete vähemalt korra alla kerinud veebilehte:

Selle nupu tekitamiseks tuleks veebilehele lisada artikkel, mille lähtekoodi alla tuleb lisada järgnev kood:

<p style="text-align: justify;">
&nbsp;</p>
<meta content="width=device-width, initial-scale=1" name="viewport" />
<style type="text/css">
body {
 
}
 
#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}
 
#myBtn:hover {
  background-color: #555;
}</style>
<button id="myBtn" onclick="topFunction()" title="Liigu tagasi üles">Tagasi üles</button><script>
//Get the button
var mybutton = document.getElementById("myBtn");
 
// When the user scrolls down 20px from the top of the document, show the button
window.onscroll = function() {scrollFunction()};
 
function scrollFunction() {
  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
    mybutton.style.display = "block";
  } else {
    mybutton.style.display = "none";
  }
}
 
// When the user clicks on the button, scroll to the top of the document
function topFunction() {
  document.body.scrollTop = 0;
  document.documentElement.scrollTop = 0;
}
</script>

Kui on soov sama nuppu mitmele lehele lisada, siis ei pea tekitama igale lehele eraldi artiklit, vaid teistele lehtedele on võimalik kuvada sama artiklit. Selleks tuleb lehele lisada uus veebisisu kuva (Lisa - Veebisisu kuva), klikata veebisisu alla oleval  hammasratta ikoonil ("Vali veebisisu") ning leida nimekirjast vastav artikkel.