由于某些原因,当我使用window.onload = function(){而不是document.ready = function(){
我想使用文档准备就绪的原因是,我正在使用tweenmax补间的图像加载得不那么快,因此动画与其他所有内容都关闭了。
<script>
var footer = document.getElementById("footer");
var topper = document.getElementById("topper");
var box = document.getElementById("photo");
window.onload = function() {
TweenMax.from(box, 4, {height:"200px", width:"200px", top:"50%", left:"50%", marginTop:"-100px", marginLeft:"-100px", ease:Power3.easeIn});
TweenMax.from(topper, 4, {top:"50%", left:"50%", marginTop:"-100px", marginLeft:"-105px", width:"210px", ease:Power3.easeOut});
TweenMax.from(footer, 4, {bottom:"50%", left:"50%", marginBottom:"-100px", marginLeft:"-105px", width:"210px", ease:Power3.easeOut});
};
</script>
$(document).ready(function() {});
是jQuery函数,因此您必须先添加jQuery参考,然后再尝试运行它。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
var footer = document.getElementById("footer");
var topper = document.getElementById("topper");
var box = document.getElementById("photo");
$(document).ready(function() {
TweenMax.from(box, 4, {height:"200px", width:"200px", top:"50%", left:"50%", marginTop:"-100px", marginLeft:"-100px", ease:Power3.easeOut}); // <-- edited Power3.easeIn to Power3.easeOut
TweenMax.from(topper, 4, {top:"50%", left:"50%", marginTop:"-100px", marginLeft:"-105px", width:"210px", ease:Power3.easeOut});
TweenMax.from(footer, 4, {bottom:"50%", left:"50%", marginBottom:"-100px", marginLeft:"-105px", width:"210px", ease:Power3.easeOut});
});
</script>
编辑:更新以更改
TweenMax.from(box, 4, {height:"200px", width:"200px", top:"50%", left:"50%", marginTop:"-100px", marginLeft:"-100px", ease:Power3.easeIn});
到
TweenMax.from(box, 4, {height:"200px", width:"200px", top:"50%", left:"50%", marginTop:"-100px", marginLeft:"-100px", ease:Power3.easeOut});
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句