DD77 Posted February 10, 2021 Share Posted February 10, 2021 Hello, I'm struggling to make the modal to close onlclick. If I click outside of the modal anywhere, the modal should close. Any help much apreciated. See the Pen ExNPpXQ by davide77 (@davide77) on CodePen Link to comment Share on other sites More sharing options...
ZachSaucier Posted February 10, 2021 Share Posted February 10, 2021 Hey DD77. You've got a couple of warning about elements not existing. You should fix those. Besides that, this is a logical issue. You should play your animation when the open button is clicked and reverse it when anything outside of the modal or the close button is clicked. If you have a specific question about GSAP let us know and we'll do our best to help. 1 Link to comment Share on other sites More sharing options...
DD77 Posted February 10, 2021 Author Share Posted February 10, 2021 Thanks, for your idication, the way I'm thinking is this below... you lost me.. See the Pen ExNPpXQ?editors=1010 by davide77 (@davide77) on CodePen Link to comment Share on other sites More sharing options...
DD77 Posted February 11, 2021 Author Share Posted February 11, 2021 I managed to solve an issue and create another one. Now the position on the button is more than one. hellllllllllpppp See the Pen poNEGEL?editors=1112 by davide77 (@davide77) on CodePen Link to comment Share on other sites More sharing options...
mikel Posted February 11, 2021 Share Posted February 11, 2021 Hey @DD77, Are you kidding? See the Pen rNWWMGz by mikeK (@mikeK) on CodePen Happy tweening ... Mikel Link to comment Share on other sites More sharing options...
DD77 Posted February 11, 2021 Author Share Posted February 11, 2021 Thank you Mikel, as usual you turned a some code into a piss of cake... On my demo, I have multiple buttons, where I can open the modal. Then once opened a simple closing button, with a click outside the modal that could close it too. On your demo I think you misinterpreted my initial question. Link to comment Share on other sites More sharing options...
ZachSaucier Posted February 11, 2021 Share Posted February 11, 2021 @DD77 Your demo has errors in the console when you click the button. Fix those. There's likely no reason why you would need .getBoundingClientRect, you can just animate the element using the x, y, xPercent, yPercent, scale, and autoAlpha properties. Again, most of your issues are logical. Sorry, but we don't have the capacity to build your project for you for free. 2 Link to comment Share on other sites More sharing options...
DD77 Posted February 11, 2021 Author Share Posted February 11, 2021 Thanks for your lecture:-) I removed the getBoundingClientRect and now works.... I hope is now logical what I've done.. 1 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