Question

我是一名JavaScript初学者。我想在简单的幻灯片中用幻灯片转换替换淡入淡出过渡。

到目前为止，我无法这样做。目前的代码如下：

function transSlide()
{
    nextSlide.style.display = "block";

    var opacity = slideTransStep / slideTransitionSteps;

    crtSlide.style.opacity = "" + (1 - opacity);
    crtSlide.style.filter = "alpha(opacity=" + (100 - opacity*100) + ")";

    nextSlide.style.opacity = "" + opacity;
    nextSlide.style.filter = "alpha(opacity=" + (opacity*100) + ")";

    if (++slideTransStep <= slideTransitionSteps)
        transTimeout = setTimeout("transSlide()", slideAnimationInterval);
    else
    {
        crtSlide.style.display = "none";
        transComplete();
        clearInterval(myVar);
    }
}

Answer 1

opacity的Intead，您要更改position以及top，left，bottom和right，{{3 }}

也就是说，我认为您可以“手动”编写JavaScript动画以用于学习目的，但是您通常应该使用库来实现这样的东西。初学者有see MDN documentation here和jQuery。

修改

当然，我可以帮忙。我创建了一个jQuery UI effects，其中包含一个非常基本的动画示例。它使用setInterval定期执行一些代码并增加CSS属性left以移动元素。你可以在这里查看：CodePen甚至用它来分叉它。

如何通过幻灯片放映中的幻灯片转换替换淡入淡出过渡（仅限javascript）？

1 个答案: