Search the Community
Showing results for tags 'cross dissolve'.
Hi All, Beginner here. I'm hacking code given to me on this forum by PointC. I need to know how to reverse the scaling/cross-dissolving in my codpen demo: http://codepen.io/pfash/pen/aprmxq ...by clicking on the red box a second time. IOW: you click on the red box once to have it dissolve into the blue box and scale up...and then you click on the red box again and it all goes in reverse. That second part is my question. NOTE: This demo is supposed to have the red box on top of the blue box (so the red color smoothly transitions into blue) but I didn't have time to figure that out for this codepen demo and it's not critical to my question. Another concern: the scaling up (zooming larger) and cross-dissolving is not as smooth as I expected it'd be. You can see the blue box flash a bit. Any ideas why? Thanks much!
Hello, Pretty sure this has been addressed before but I'm so new to this, I'm not recognizing it in the archive: I need to cross dissolve one dashboard image into another when user clicks on hotspots. I've done this here (with JS and CSS In this individual web page): http://bigbendhc.org/theUplink/codeDemos/responsiveCrossfadeMultipleImgsAndZoom.html ...but I now need to do this all within the Animate CC and GSAP framework. (I've heard that Animate + GSAP is a better way to build this app.) I've gone through Corey Hudson's tutorials (https://greensock.com/animatecc-quickstart and https://greensock.com/animatecc-templates) but now I need help to pull it all together: Do I use GASP tween code to do the cross-dissolving? Which code do I use? Where does that code go (into the JS layer in the timeline in the Animate file...or does it go into the HTML wrapper? Do I create the hotspots in the HTML wrapper? Do I build the cross-dissolve and the hotspots interactivity in the AnimateCC program? As you can tell by these questions, I'm floundering. If you just want to refer me to another tutorial that will help me take it a step further that's fine. Thanks for any help!