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

Question

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

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，但我就是不明白？

非常感谢您的帮助

Answer 1

是的，您可以将 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 
}
?>}