Jquery анимирует изображение ровно один раз (при загрузке страницы), а затем остается «СУХИМ»? - PullRequest
0 голосов
/ 10 февраля 2011

У меня есть простая анимация на моем сайте rails, которая выдает div (с изображением логотипа внутри) из-за div, используя функцию ' animate ' в Jquery, которая прекрасно работает!

Однако я не могу понять, как заставить его запускаться ровно один раз на целевой странице, а затем сделать так, чтобы div оставался на каждой другой странице и при перезагрузке страницы.Каждая загрузка страницы по всему сайту запускает анимацию каждый раз.Я поместил div JQuery, который анимируется внутри файла application.html.erb, поэтому он является частью заголовка для шаблона всего сайта (который объясняет, почему он отображается при каждом просмотре).

Я знаю, что могу просто скопировать и вставить код в партиалы и создать отдельные записи CSS для отображения логотипа на каждой странице, но я пытаюсь сохранить свой код СУХИМЫМ.

Вот мой javascript:

$(document).ready(function() 
 {
    $('.logo .active-image').animate({
       opacity:1,          //set opacity
       marginTop: "-90px", //move the image 'up' 90px
       }, 5000);           //animate over 5 secs
 });

И div изображения логотипа на всем шаблоне сайта:

<div class="logo">
     <%= image_tag("../images/logo.png", :class => 'flying-image active-image') %>
</div>

Итак, есть ли Rails-y, СУХОЙ, способ сделать этоиспользуя только jquery?

1 Ответ

3 голосов
/ 10 февраля 2011

Я вижу два возможных решения здесь. HTTP сам по себе не имеет состояния, но вам нужно некоторое состояние, например, Msgstr "Это первый просмотр страницы пользователя X?"

Теперь вы можете либо сохранить флаг в сеансе вашего пользователя, либо сохранить его в отдельном файле cookie. Последний будет включать только JavaScript.

Проект решения JavaScript / Cookie

if (!$.cookie('visited_before')) {
    $('.logo .active-image').animate({
        opacity:1,          //set opacity
        marginTop: "-90px", //move the image 'up' 90px
        }, 5000
    );
    $.cookie('visited_before', true);
}

Это всего лишь пример использования псевдо-функции jQuery cookie. Вероятно, имеется достаточно плагинов для обработки файлов cookie.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...