sunirmalya Posted September 10, 2022 Share Posted September 10, 2022 this is really just a question I love how bootstrap rejigs everything when you reduce the window size. So for example, i have 3 pics in a row of 3 columns, when i reduce the window size it becomes 1 column and the pics follow one another. i am guessing this cannot be done with GSAP and bootstrap together and we have to use that MediaMatch and forget bootstrap - is that right? Link to comment Share on other sites More sharing options...
Rodrigo Posted September 10, 2022 Share Posted September 10, 2022 Hi, You can definitely use GSAP and Bootstrap without any issue. GSAP is 100% agnostic in order to maximize compatibility with your preferred tools. For this you can set up your Bootstrap image grid using Flexbox and let the Flip plugin do the rest for you: https://greensock.com/docs/v3/Plugins/Flip This codepen example from the GreenSock collection shows how simple it is: See the Pen zYqLjre by GreenSock (@GreenSock) on CodePen Happy Tweening!!! 3 Link to comment Share on other sites More sharing options...
sunirmalya Posted September 10, 2022 Author Share Posted September 10, 2022 thanks for that - i am looking at the tutorial now, but can i ask how do you find the screen size to automatically flip? Thanks so much for your help and really appreciate your time Link to comment Share on other sites More sharing options...
mvaneijgen Posted September 10, 2022 Share Posted September 10, 2022 11 hours ago, sunirmalya said: how do you find the screen size to automatically flip? There is no automatically, you're the developer so you need to implement it as you see fit. I would look in to the new gsap.matchMedia() function, seems like the perfect use case for it. https://youtu.be/9gipsKpWozE 3 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now