我有以下2个JS函数,我需要将它们组合起来,1个接一个。脚本1加载DIV,第二个脚本是我想在div加载后播放的动画:
这是第一个:
<script>
$(document).ready(function() {
var controller = $.superscrollorama();
// individual element tween examples
controller.addTween('#container', TweenMax.fromTo( $('#container'), .25, {css:{opacity:0, scale:0, }, immediateRender:true, ease:Quad.easeInOut}, {css:{opacity:1, scale:1}, ease:Quad.easeInOut}));
controller.addTween('#container2', TweenMax.fromTo( $('#container2'), .25, {css:{opacity:0, scale:0, }, immediateRender:true, ease:Quad.easeInOut}, {css:{opacity:1, scale:1}, ease:Quad.easeInOut}));
});
</script>
这是第二个:
<script>
$(document).ready(function () {
$('.numbers').delay(1).animate({
'margin-left': '100px'
}, {
duration: 1000,
queue: true
});
});
</script>
小提琴:http://jsfiddle.net/fatfrank44/wRfu5/2/
谢谢!
答案 0 :(得分:0)
如果我理解你的问题,你只想这样做。
<script>
$(document).ready(function() {
var controller = $.superscrollorama();
// individual element tween examples
controller.addTween('#container', TweenMax.fromTo( $('#container'), .25, {css:{opacity:0, scale:0, }, immediateRender:true, ease:Quad.easeInOut}, {css:{opacity:1, scale:1}, ease:Quad.easeInOut}));
controller.addTween('#container2', TweenMax.fromTo( $('#container2'), .25, {css:{opacity:0, scale:0, }, immediateRender:true, ease:Quad.easeInOut}, {css:{opacity:1, scale:1}, ease:Quad.easeInOut}));
$('.numbers').delay(1).animate({
'margin-left': '100px'
}, {
duration: 1000,
queue: true
});
});
</script>
答案 1 :(得分:0)
除了ComFreek提到的你没有正确地从GitHub中包含Javascript(我已经在JSFiddle中修复),你将scale和opacity都设置为0,这使得你的div&#34;消失了#34;从屏幕上。如果你解决了这个问题,那么你的动画就可以了。
css: {
opacity: 1,
scale: 1,
}