Search the Community
Showing results for tags 'scrollmagic transform'.
Found 1 result
-
Hi everyone, im working on this site width scrollmagic: http://project.at.w01203b5.kasserver.com/ username: greensock password: greensock in the middle there are 3 pictures with this animation: new ScrollMagic.Scene({triggerElement: "#parallax_trigger_1", duration: 800}) .setTween("#parallax_1 > div.parallax_image", {y: "200%", ease: Linear.easeNone}) //.addIndicators() .addTo(controller); the problem is that the pictures / animation gets very shaky and flickering in safari and firefox (mac) and IE11 (PC) - other browsers like Firefox (PC), Chrome (mac + PC) seem to be ok you can see it at the picture with the 2 people (woman and man) above headline "Strategisch. Innovativ. Umsetzbar. Erfolgreich. Überprüfbar." - you have to scroll i tried all the css workarounds like --moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); transform: scale(1.00001), translateZ(0.00001); -webkit-transform: scale(1.00001), translateZ(0.00001); -moz-transform: scale(1.00001), translateZ(0.00001); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -webkit-filter: opacity(.9999); -webkit-font-smoothing: antialiased; -webkit-font-smoothing: subpixel-antialiased; -webkit-text-stroke: 0.35px; but it doesn't work - i also tried .setTween("#parallax_1 > div.parallax_image", {y: "200%",rotation:0.001, ease: Linear.easeNone}) but still flickering any ideas how to fix that? thanks for your help, steri