In this article, we are going to create a small 3D scene, where the user can scroll on the z-axis. You can find the final code of this tutorial o...
For further actions, you may consider blocking this person and/or reporting abuse
I'm trying to make a version with my own content.
But this is not working out.
I added the code of the cards to my CSS.
But in my .js I now still have the link to the 'film file', if I remove that, my own content shows but the scrolling does not work anymore. Can you tell me what I'm doing wrong?
Hey, do you have a link to a repo so I can have a look ?
Hee Vincent,
It is online at nikkiloef.com
Thank you for taking a look!
You need to change your js so you look into the length of your cards instead of the films. You should remove axios as well 😉.
jsbin.com/catogajise/3/edit?html,c...
Thank you for the help!
And for sharing the knowledge in the first place.
🤯I'm mind blown, this is amazing! Thanks for sharing!
No worries, Thanks for checking it out 😃
This effect is amazing. I was wondering if you've figured out a way to "autoscroll" through z-space to anchor links on specific divs. What I've found is that adding anchor links to specific divs does nothing without a js smoothing script, but when the script is added, it will "scroll" to a different location each time, moving back and forth even when the same anchor link is clicked in succession. I've tried changing the order of the scripts and trying lots of different scripts. The scroll behavior is also different between browsers as well as codepen Is scrolling to anchor links just not possible when scrolling through z-space?
Anyways, I appreciate the article and what you've already elaborated, so thanks again. I'd just like to know if you uncovered anything inherent in the js or css that prevents it from working correctly, or if I'm chasing a dead end.
codepen.io/saurier/pen/GRgxqNz
I have a scene with 68 elements. I updated the CSS with 68 children plus the JS with 68 elements for the Scene Height however, on the 50th div, the following images stay on the background without any position on the "tunnel"
This was awesome! I have the perfect project to use it on. Thank you sir!!
This so cool!!! I really liked it!
Thank you Luciano 😃
This is one of the coolest things I have seen. Thanks for sharing this!
Wow. This article is for me like CSS sci-fi. Wow.
Thats was helpful, thanks!
Sounds great.
Thanks 🤟
This a very creative use of css and has a really enjoyable result, thanks for sharing!
Awesome, I will try it in my next personal project
Looking forward to seeing the result 😀
Awesome post!