Це відео не доступне.
Перепрошуємо.
How I set up Horizontal Scroll in 5 minutes with GSAP & Bricksbuilder - no code needed
Вставка
- Опубліковано 16 сер 2024
- Hey guys - good news: Building a page with horizontal scroll is now possible for you without any code! 🥳 By watching this video, you'll learn how to do it in less than 5 minutes (no joke!). We will just use Bricksbuilder and Bricksforge's animation panel (with its UI for GSAP). And we'll use a typical use case: vertical scrolling, then switching to horizontal and back to vertical. Have fun checking it out and start making the Internet a better place with your stunning websites! 👍🏻
Table of contents:
0:00 Intro
0:34 Step 1 - Setting up the structure in Bricksbuilder
2:03 Step 2 - Configuring the GSAP Timelines in the Bricksforge Panel
5:03 Horizontal Scroll already works
5:52 How to adjust the horizontal scrolling speed
7:23 Is it responsive?
08:00 Conclusion
Here's the link to the files: ⬇️ heikodietze.gu...
#bricksbuilder #gsap #gsapanimation #bricksforge
Amazing, it's really nice to see someone making content about bricksforge. I already found a way to do the horizontal scrolling but your video make things more clear so thanks a lot, just one thing, would it be possible to make a video showing how to animate elements inside this horizontal scrolling? Thanks again, and wish you a lot of success with your channel
Thank you, Omar - very happy to hear that! 🙏🏻 🥳 And your request will definitely be added to the list of upcoming videos! 👍🏻
thank you! an awesome video.. short and educative :) please keep doing more with Bricksforge!
Big thanks for your words, @esquedm! I will try! 👍🏻
Great, Thank you!
Glad you liked it! 👍🏻
Thanks for this tutorial! It's amazing. Would you know how to horizontal scroll elements inside a container that would overflow 100vw? For instance, I was trying to create like a team members carousel but instead of having navigation arrows I wanted to horizontal scroll them. But I could not achieve the effect because the pin would stop where I wanted in different screens or devices, do you think it would be possible to make a tutorial or explain to me? Thank you so much for taking the time to make this awesome material. Best wishes!
Cool short tutorial 🎉. Finally more Bricksforge Content ❤️✌️
@dynamic-homepages Thank you! 🙏🏻 happy you liked it!
That's the shortcut - download the templates here (Bricks + Bricksforge): heikodietze.gumroad.com/l/horizontalscroll
Would love to see a tutorial where a fixed navigation (like a sticky header or something) triggers the animation to the linked section.
Sounds interesting, idea noted! ✅
Awsome Tutorials! I tried importing the downloaded .json files, I noticed there are three files, can you please share how to use these files? Insert one at a time?
Hey @CowMeCow - sorry, was afc due to heavy cold. You should (and I just tried it myself to be sure) just see one Bricksbuilder template and then import it. It will then contain the 3 sections. Did this help? Thank you very much for the compliment btw! 🙏🏻
Great tutorial. You can use the class .bricks-is-frontend for the flex direction. This way the flex direction will only be applied to the frontend and not in the editor.
Great idea, @djkasperg! 👌🏻 And you mean in the custom CSS, right?
@@heikodietze Exactly
is it possibe to combine with scroll snap? like when you scroll horizontally its stop on the center of container?
Nice video anw! love it!
Hi @yogibagasd - Thank you very much! 🙏 And: To achieve the effect is probably possible. Haven't tried it yet. Just not with CSS - it often conflicts with GSAP. But maybe with several timelines: one for each container. And without the scrub option. If I got time, I'll try it out.
@@heikodietze thanks, would like to know more about this! As im trying learning the gsap with BF currently
You didn’t set up anything with GSAP & Bricks.
You set it up with bricksforge! Why don’t you put in your title?
It sounds like I wasted your time with my video. If so - sorry. And good point: I'll put it in the video title next time, even if it gets very long.
Just Subscribe, be fantastic if you can. If you made a long video using all acf and bricksforge making a Recipe auto box, let's say you made a Recipe for 1 person, and there let say grams and kg different weights amount needed, I'd there wad a box to add a number let's say, 5 and it automatically x5 the information so it show x5 of the Recipe amount.
Did not fully understand you, but thank you for the comment and subscribing. 👍🏻
@@heikodietze can you make a step by step video how to make a calculator from, all the beginning ACF and bricksforged to end? without leaving nothing out, even if the video like 1 hour long, so you show all acf being build etc, i give an example, lets say you wanted to make a cake, it has different ingredients, with different amounts of grams for each ingredient need to be used to make a cake, lest say for 1 person, so if you had a box where you can put any number from 1 or 9999 it automatically changing all the below ingredients from 1 person to or 9999 so when you make a cake for how many people you need for each ingredients needed in each grams