Great article, thanks. If you want to have the URL hashtag update as you cycle through, add something like " linkid='X' " to each a href, then add an onclick event to each link, where the parent.location.hash changes to the whatever the linkid attribute is . If you want to then add that in to the url's page history, use window.history.pushState(..... then the user can navigate back to previous sections via the back button.
I wanted to express my sincere gratitude for the invaluable knowledge and insights I've gained from you. Your guidance has been instrumental in my growth, and I deeply appreciate the opportunity to learn from your expertise.🥳
Brother, " *window.onscroll* " property is not working. I had to use " *window.addEventListener("scroll" , )* " instead to make it work.. But I still couldn't figure out why * .onscroll* didn't work, can you please tell why it didn't work, has it gone deprecated or something, or any other issue..??
This is great video works absolutely fine. But there is one more issue. When I click on the nav link, the page scrolls to top of the page, and my page is hiding under the navbar. So content of the page hides by header. How can we add the header offset so clicking on the nav link scrolls to just after the header? Can anyone have this problem and can suggest what we can do for this?
I usually do it using the uselocation hook lol, but it's just a cheap workaround, if your website is veryyyy small orrr you can maybe use isActive (I remember it was used by me in my beginner coding days) there's some library for that in react Ps: I assumed you've used react here
Yo, I could see it working but the .active part is not really working ( I am using react), any solutions? I tried looking up and I feel the possible reason is the `.classList` being used. can anyone help me out??
I finally found what I was looking for.... Thanks dude
Your channel is a piece of cake! Thank you for too many things you're sharing with us, I'm learning a lot! My best regards from Brazil. 🇧🇷
Glad to help 💚
Que legal encontrar outros brasileiros que gostam desse canal.
Great article, thanks. If you want to have the URL hashtag update as you cycle through, add something like " linkid='X' " to each a href, then add an onclick event to each link, where the parent.location.hash changes to the whatever the linkid attribute is . If you want to then add that in to the url's page history, use window.history.pushState(..... then the user can navigate back to previous sections via the back button.
Thank you for the great video! Have been looking for a right and smooth solution for a couple of days.
it's a very helpfull for me....Thanks 👍
Cool, but what if all sections are not 100vh? If all sections are 100vh it's easy, but what do you do if they are not?
perfectly working. This is an amazing video.😘
You're very good at explaining
Amazing work. Simple yet impactful and full of knowledge. Thank you so much I need to leave a comment expressing my gratitude.
Thank you! That's absolutely fine
It helped a lot. Thank you so much 😊
Many many thanks brother❤❤❤❤❤❤
Lovely song in starting
I wanted to express my sincere gratitude for the invaluable knowledge and insights I've gained from you. Your guidance has been instrumental in my growth, and I deeply appreciate the opportunity to learn from your expertise.🥳
Brother, " *window.onscroll* " property is not working. I had to use " *window.addEventListener("scroll" , )* " instead to make it work..
But I still couldn't figure out why * .onscroll* didn't work, can you please tell why it didn't work, has it gone deprecated or something, or any other issue..??
Yoe have to use window.scrollY ...
thanks appreciate the help.
Amazing work❤❤❤
Thank you 💚
This is great video works absolutely fine. But there is one more issue. When I click on the nav link, the page scrolls to top of the page, and my page is hiding under the navbar. So content of the page hides by header. How can we add the header offset so clicking on the nav link scrolls to just after the header? Can anyone have this problem and can suggest what we can do for this?
Muito boa a explicação 😊✌️ Deus abençoe!
Do i need to use section or can i use div to
Mine doesn't work at all with the scroll-behavior: smooth function, does anyone know why?
If I put "top >= offset - 98 (height of header), then only it is perfectly working with complete scroll to the section...Any suggestion?
@Codehal the onscroll and scrollY doesnt work...
can I use this in my website?
Muchas gracias, por compartir... comprendido
This was single page website but if we have multi page website how make active link in that case ???
Pretty sure you can do:
a:is(:link, :active, :visited).active { color: white; background-color: black;}
Just apply the .html of that multi page in anchor tag
I usually do it using the uselocation hook lol, but it's just a cheap workaround, if your website is veryyyy small orrr you can maybe use isActive (I remember it was used by me in my beginner coding days) there's some library for that in react
Ps: I assumed you've used react here
Can we do this using php instead of js?
Obrigado , me ajudou bastante .
just do on the css do this for easy code
*{
scroll-behavior: smooth;
}
its done it works just like in the video
The logic starts @ 6:30
This is what I find thanks
Responsivo, responsive?
How can you do the same but using react?
There is a wrong in classList.add('active') do anyone know the reason,please?
😇cool thank you soooo much
Lots of love bro
Thanks awfully!
Thank you
Yo, I could see it working but the .active part is not really working ( I am using react), any solutions? I tried looking up and I feel the possible reason is the `.classList` being used. can anyone help me out??
This amazing
How to put a text inside it broo if i put text its not inside
I didnt apply java script and its stilll working hmm
0:16 how to make this effect when double click on the text
by pseudo element ===>
::selection{
}
it works for the first 5 section, but it doesnt work on the last lmao
@aman12988
@aman12988
1 month ago
Brother, " window.onscroll " property is not working
bro use window.scrollY property ... it works
window.scrollY doesn't work either