Hi Everyone,
I have been trying to set GSAP on a Joomla website. Well, was able to make it work with the quote below BUT with issues, now the trigger always start way before it should. It starts at the beginning of the page instead of at the orange div start like in the doc example.
<script type="text/javascript">
jQuery(document).ready(function() {
var controller = new ScrollMagic.Controller();
var blockTween = new TweenMax.to("scblock", 1.5, {
backgroundColor: '#f1f1f1f1'});
var containerScene = new ScrollMagic.Scene({
triggerElement: 'sccontainer'
})
.setTween(blockTween)
.addIndicators()
.addTo(controller);
}); //ready
</script>
This code was taken out from the doc example at https://github.com/janpaepke/ScrollMagic/wiki/Get-Started-First-Tween
the only difference is that the CSS id to work in Joomla can't include the '#' like already reported on a different topic within this forum.
There are no errors showing on the Chrome and/or Firefox Firebug console.
Take a look at the attached image to see what I mean.
Anyideas on why this is happening?
Thanks for the help guys