1

我刚刚试用了 TweenLite,我快要疯了,因为我从网站上复制了代码,但我无法让它动画化。

CSS

.box{
  width: 100px;
  height: 300px;
  background-color: red;
}

html

<div class="box"></div>

JS

   setTimeout(function(){
        var target = $('.box');
        console.log("box = ", target);
        TweenLite.to(target, 1, {css:{height:"0px"}});
    },2000);

也试过没有css。

   setTimeout(function(){
        var target = $('.box');
        console.log("box = ", target);
        TweenLite.to(target, 1, {height:0});
    },2000);

是的,我在 jquery 文档就绪方法中有 JS。我还加载了 TweenLite.js。任何人都知道我错过了什么。

4

1 回答 1

2

不确定您的设置到底发生了什么,但代码对我来说很好。这是一个代码笔:

http://codepen.io/GreenSock/pen/9e7c951949caa10b928d929378947f01

我也稍微简化了代码,尽管您使用的长手样式很好。您不需要使用 setTimeout() 来延迟启动 - 只需使用“延迟”特殊属性。

TweenLite.to(".box", 1, {height:0, delay:2});

我想知道您的特定设置中是否没有加载 jQuery 或 GreenSock JavaScript 文件。如果您仍然遇到问题,请发布一个简单的 codepen 或 jsfiddle 的链接,我们会看一看。

于 2013-07-03T00:20:35.220 回答