将动画延迟添加到Divi标准CSS

问题描述

对于我的网站,我使用Divi作为主题。 divi功能一个很好的细节是 divi点导航,对于这个特殊的问题,我试图通过延迟 divi来覆盖认的 divi点导航功能。点导航应该从右边变得可见并具有动画效果。在下面的代码中,我添加了-800px,以确保该自定义代码实际上可以正常工作-是的,它可以!

我一直在尝试:

ul.et_pb_side_nav.et-visible {
    opacity: 0;
    -webkit-animation: fadeInRight 1.5s 1 cubic-bezier(.77,.175,1) !important;
    -moz-animation: fadeInRight 1.5s 1 cubic-bezier(.77,1) !important;
    -o-animation: fadeInRight 1.5s 1 cubic-bezier(.77,1) !important;
    animation: fadeInRight 1.5s 1 cubic-bezier(.77,1) !important;
    -webkit-animation-delay: 20s;
    animation-delay: 20s;
}


/* Chrome,Safari,Opera */
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-800px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

/* Standard Syntax */
@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translateX(-800px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

即使动画来自-800px,但延迟也不起作用!我需要此动画在开始前等待 20秒

您对此有何建议? (看来divi点导航的pro version不能设置动画延迟)

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)