Question

我需要一个函数来获取每次调用行时执行位移所需的值。如果我使用line.play()或line.reverse()，则会缓存该值，并且不会调用该函数。如何让它每次调用此函数（但不是每次都重新创建时间轴）？

以下是代码：

var line;

var getLeftPosition = function() {
    return ($("body").width() - $("#dvCart").width()) + "px";
}

$("#btnCart").click(function () {

    if (!line) {
        line = new TimelineMax()
            .to("#dvCart", .1, { display: "block" })
            .to("#dvLock", .7, {
                backgroundColor: "#fff",
                opacity: 0.5,
                filter: "alpha(opacity=20)",
                width: "100%",
                height: "100%",
                top: "0",
                left: "0",
                position: "fixed",
                display: "block",
                ease: Power3.easeInOut
            })
            .to("#dvCart", .5, {
                "left": getLeftPosition(),
                ease: Power3.easeInOut
            });

        $("#dvLock").click(function () {
            line.reverse();
        });
    }
    else {
        line.play();
    }
});

帮助阅读：

第一次点击时，我希望它初始化时间线;
每隔一段时间，它就会播放时间线;
点击dvLock时，购物车需要消失;
dvLock是一个放在购物车后面的div，用于锁定屏幕;
dvCart是一个包含一堆选定项目的div;

Answer 1

发布此问题后，很明显如何搜索。经过一些谷歌搜索后，我找到了一种方法：在TweenMax上使用updateTo函数。

我正在回答我的问题，以帮助任何可能需要它的人。

代码变成了这样：

var line;

var getLeftPosition = function() {
    return ($("body").width() - $("#dvCart").width()) + "px";
}

var moveToLeft;

$("#btnCart").click(function () {

    if (!line) {

        line = new TimelineMax()
            .to("#dvLock", .1, { zIndex: 1031 })
            .to("#dvCart", .1, { display: "block" })
            .to("#dvLock", .7, {
                backgroundColor: "#fff",
                opacity: 0.5,
                filter: "alpha(opacity=20)",
                width: "100%",
                height: "100%",
                top: "0",
                left: "0",
                position: "fixed",
                display: "block",
                ease: Power3.easeInOut
            })
            .append(moveToLeft = TweenMax.to("#dvCart", .5, {
                "left": getLeftPosition(),
                ease: Power3.easeInOut
            }));

        $("#dvLock").click(function () {
            moveToLeft.updateTo({
                "left": getLeftPosition()
            });
            line.reverse();
        });

    }
    else {
        moveToLeft.updateTo({
            "left": getLeftPosition()
        });
        line.play();
    }
});

因此，在每个reverse或play之前，它会更新左侧位置。

如何在TimelineMax中更新值？

1 个答案: