jeudi 8 juillet 2021

IF Path Name Equals "/" fire this, if not, stop the script

I am using a progress bar that increases the more you scroll in my website. This is the code:

<script>
 window.onscroll = function() {myFunction()};
  function myFunction() {
   var winScroll = document.body.scrollTop || document.documentElement.scrollTop;
   var height = document.documentElement.scrollHeight - 
   document.documentElement.clientHeight;
   var scrolled = (winScroll / height) * 100;
   document.getElementById("myBar").style.width = scrolled + "%";
   } 
 </script>

1st Challenge:

The problem is that I use Ajax and even if a give it a condition to only fire when page path = "/", when I go to other pages it's still there since there is no actual page reload.

💭 ... How can I get the script to stop or hide the element when that happens? ... 💭

The condition I'm currently using for that (not working):

if (window.location.pathname == "/") {
} else { 
document.getElementById('pendejada').style.display = 'none';
}

2nd Challenge:

Also, I have hash changes in the URL when you click at the menu on top but they don't take you elsewhere, you stay on the same page.

💭 ... How can I get the function to stop when page path is not "/", like mentioned above, but without being interfered by these hash changes... 💭

I tried using this but it was not a smart option because when the page path changes none of this happen:

window.addEventListener('hashchange|popstate' )

I appreciate you guys helping me :) 🙌

Aucun commentaire:

Enregistrer un commentaire