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.
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..??
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
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.🥳
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?
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.
perfectly working. This is an amazing video.😘
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 👍
Many many thanks brother❤❤❤❤❤❤
It helped a lot. Thank you so much 😊
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
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?
Very useful, thanks! I have a question, its 100% responsive?
Amazing work❤❤❤
Thank you 💚
Muchas gracias, por compartir... comprendido
Obrigado , me ajudou bastante .
Muito boa a explicação 😊✌️ Deus abençoe!
thanks appreciate the help.
Lovely song in starting
Do i need to use section or can i use div to
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 ...
The logic starts @ 6:30
🔥🔥🔥🔥🔥🔥🔥
@Codehal the onscroll and scrollY doesnt work...
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
😇cool thank you soooo much
0:16 how to make this effect when double click on the text
by pseudo element ===>
::selection{
}
can I use this in my website?
Can we do this using php instead of js?
This is what I find thanks
Mine doesn't work at all with the scroll-behavior: smooth function, does anyone know why?
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.🥳
Thank you
Responsivo, responsive?
If I put "top >= offset - 98 (height of header), then only it is perfectly working with complete scroll to the section...Any suggestion?
Lots of love bro
Thanks awfully!
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?
This amazing
How can you do the same but using react?
just do on the css do this for easy code
*{
scroll-behavior: smooth;
}
its done it works just like in the video
There is a wrong in classList.add('active') do anyone know the reason,please?
How to put a text inside it broo if i put text its not inside
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??
where is code??
I didnt apply java script and its stilll working hmm
it works for the first 5 section, but it doesnt work on the last lmao
Can somone send me the code pls
@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