javascript - jQuery - 在 session 中仅运行一次动画

标签 javascript jquery animation

我正在使用以下函数在页面首次加载时启动动画。而且效果很好。

function checkAnimation_ss() {
    var $elem = $('.ss');
    // If the animation has already been started
    if ($elem.hasClass('icon_start')) return; //or same session??
    if (isElementInViewport($elem)) {
        // Start the animation
        $elem.addClass('icon_start');
    }
}

我的问题是,当我导航到另一个页面然后点击浏览器的“后退”按钮时,动画再次开始。

有没有办法让动画在 session 中只运行一次? 我知道我需要以某种方式使用 jquery.cookie.js,但我就是不明白?

非常感谢您的帮助

最佳答案

是的,您可以将 cookie 与 jquery.cookie.js 一起使用,在这种情况下您会想要执行类似以下操作:

 function checkAnimation_ss() {
var cookieValue = $.cookie("animation");
if(cookieValue == 1)
{}
else
{
    var $elem = $('.ss');
    // If the animation has already been started
    if ($elem.hasClass('icon_start')) return; //or same session??
    if (isElementInViewport($elem)) {
        // Start the animation
        $elem.addClass('icon_start');
        $.cookie("animation", 1);
    }
}}

当然如果你的网站使用php也可以解决。在这种情况下,你可以这样做:

<?php session_start(); $_SESSION['animation'] = 1; ?>

然后:

function checkAnimation_ss() {
<?php 
    if($_SESSION['animation'] == 1)
    {}
    else
    {
?>
    var $elem = $('.ss');
    // If the animation has already been started
    if ($elem.hasClass('icon_start')) return; //or same session??
    if (isElementInViewport($elem)) {
        // Start the animation
        $elem.addClass('icon_start');
        $.cookie("animation", 1);
    }
<?php 
}
?>}

关于javascript - jQuery - 在 session 中仅运行一次动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36058036/

相关文章:

javascript - Acrobat Javascript 保存和退出按钮

javascript - 使用 UI Utils 进行 Angular 表单验证

javascript - 使用 jQuery.countdownTimer.js 获取剩余时间值

javascript - 从 jquery 调用 spring 操作,无需使用 ajax 来实现多个按钮(例如 View 编辑等)

javascript - 如何在 jQuery 中处理输入类型 = 文件的 onchange 事件?

javascript/react - 在 react 状态下切换数组中两个对象的属性而不触发重新渲染

javascript - Three.js 中的 BoxBufferGeometry 与 BoxGeometry 有什么区别?

ios - asyncAfter 不延迟指定时间的第一次执行

Android如何实现围绕 ImageView 的脉动圆形动画

javascript - 使用 jquery 阻止表单提交的问题