/ / JQuery - animação de slide da página inicial no carregamento da página, mas apenas uma vez para cada visualizador - jquery, slidedown, slideup

JQuery - Animação de slide da página inicial no carregamento da página, mas apenas uma vez para cada visualizador - jquery, slidedown, slideup

Qual é a melhor maneira de deslizar duas divs uma para a outra. Basicamente, divido minha página inicial em duas seções. Quero que elas deslizem para baixo e deslizem uma para a outra, mas acontecem apenas uma vez para cada visualizador.

<div id="wrap">
<div id="slideDown">Slide down</div>
<div id="slideUp">Slide up</div>
</div>

Respostas:

1 para resposta № 1

Você precisará usar os efeitos de animação do jQuery slideUp e slideDown (veja a resposta do tandu) ou apenas use animate se você estiver se sentindo mais detalhado.

Mas, para impedir que o navegador execute essa animação em uma visita de retorno, você precisará armazenar um cookie. plugin jquery-cookie é um bom lugar para começar. Basicamente, o que você vai querer fazer é:

  1. Verifique a presença do cookie doNotLoadAnimation.
  2. Se não estiver presente, defina o cookie doNotLoadAnimation e mostre a animação; caso contrário, mostre a página sem a animação

Não será perfeito porque os cookies não são uma forma de armazenamento persistente, por ex. se um usuário limpar seus cookies, a animação será executada novamente.

Espero que ajude!


1 para resposta № 2

jQuery "s .slideUp e .slideDown ocultar e mostrar conteúdo deslizando, respectivamente. Para ter .slideUp realmente mostrar o conteúdo, é necessário usar o efeito de exibição da interface do usuário do jQuery para o slide, como em:

$("#slideUp").show( "slide", {direction: "up"} );

É difícil dizer exatamente o que você quer, e se você colar o que eu tenho lá (supondo que você tenha a interface do usuário de efeitos), ele será acionado apenas uma vez para cada visualização.