jQuery анимация только на странице загрузка

У меня есть сайт, на котором я анимирую фон при загрузке страницы. Каждый из моей страницы имеет такую структуру:jQuery анимация только на странице загрузка

<?php require 'Top.php'; ?> 
<!--Page content--> 
<?php require 'Bottom.php'; ?>

top.php выглядит следующим образом:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 

<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 

<script src="js/animate.js"></script> 

<title>Untitled Document</title> 
<link href="css/styles.css" rel="stylesheet" type="text/css" /> 
</head> 

<body> 
<div id="content"> 
    <div id="net"> 
     <div id="net-image"></div> 
     <div id="lines"></div> 
     <div id="logo"><h1>AVBELJ</h1><h2>PEČARSTVO</h2></div> 
     <div class="square" id="st1"></div> 
     <div class="square" id="st2"></div> 
     <div class="square" id="st3"></div> 
     <div class="square" id="st4"></div> 
     <div class="square" id="st5"></div> 
     <div class="square" id="st6"></div> 
     <div class="square" id="st7"></div> 
     <div class="square" id="st8"></div> 
     <div class="square" id="st9"></div> 
     <div class="square" id="st10"></div> 
     <div class="square" id="st11"></div> 
     <div class="square" id="st12"></div> 
     <div class="square" id="st13"></div> 


     <!--<img draggable="true" id="snowman" src="images/temenKvadrat.png" alt="snowman" style="position: absolute; left: 50px; top: 120px; z-index: 200;">--> 


     <nav id="menu"> 
      <ul id="mainlevel"> 
       <li><a href="about.php"><img src="images/about.png" border="0" alt="O NAS"></a></li> 
       <li><a href="items.php"><img src="images/items.png" border="0" alt="IZDELKI"></a></li> 
       <li><a href="gallery.php"><img src="images/gallery.png" border="0" alt="GALERIJA"></a></li> 
       <li><a href="references.php"><img src="images/references.png" border="0" alt="REFERENCE"></a></li> 
       <li><a href="contact.php"><img src="images/contact.png" border="0" alt="KONTAKT"></a></li> 
      </ul> 
     </nav>

и animate.js начинается с window.load:

$(window).load(function() { 
    $("#lines").slideDown(2500); 
    $('#net-image').delay(2000).fadeIn(1000); 
    $("#logo").delay(3000).animate({left: "0px"}, 2000); 
    $(".square").delay(3000).show("scale",{}, 1000); 
})

Мой вопрос , как я могу сделать анимацию, только когда я впервые загружу страницу. Теперь он оживляет каждый раз, когда нажимается новый пункт меню. Как я могу изменить его, поэтому при нажатии элемента меню анимация не происходит.

Большое вам спасибо за помощь!

источник

2014-01-03 AlesSvetina

Когда вы нажимаете меню -это, не собирается ли он на другую страницу? – Ani

Использование:

<?php 
if (!isset($_COOKIE['first_time'])) 
{ 
    setcookie("first_time", "no"); 
?> 
<script>// Your JavaScript here </script> 
<?php 
} 
?>

Первые проверки линии, если «first_time"»поле установлено в ассоциативном массиве с именем«$ _COOKIE»(который представляет собой конечно с cookie). Если он не установлен, это будет первый раз, когда пользователь запросит вашу страницу. Поэтому, установив файл cookie, вы не разрешите им снова запустить скрипт.

источник

2014-01-03 23:12:37 Tim

ОК, моя вина. он работает сейчас. Большое вам спасибо, сэр! – AlesSvetina

Вам нужно будет установить файл cookie или включить только сценарий анимации на стартовой странице.

Что касается файла cookie, вы просто устанавливаете его при посещении страницы, например. в вашем Top.php файле:

<?php 
if (!isset($_COOKIE["a_meaningful_name_for_the_animation"]): 
    setcookie("a_meaningful_name_for_the_animation", true); 
?> 
    <script src="js/animate.js"></script> 
<?php endif; ?>

Если вы уже используете сеанс, это будет та же логика сохранения значения в $_SESSION.

источник

2014-01-03 23:07:27 nietonfir

Благодарим вас за ответ. Если я настрою анимацию только на моей стартовой странице, анимация не произойдет, если пользователь войдет в мою страницу на любой другой странице, кроме стартовой. Поэтому, независимо от страницы, мне нужно запустить анимацию только один раз. Как мне это сделать, если я могу спросить? – AlesSvetina

Обновлен мой ответ соответственно – nietonfir

Если вы хотите только анимацию, чтобы произойти на странице верхнего уровня и на каких-либо других страницах вашего сайта, то у вас есть следующие варианты:

только включать код для анимации на странице верхнего уровня ,
Проверьте код, чтобы узнать, находится ли он на странице верхнего уровня (он может проверить window.location.pathname) и только инициировать анимацию, если текущий URL-адрес является верхним уровнем вашего домена (например, домашняя страница, а не страница, к).

Если вы хотите только анимации происходит, когда пользователь впервые прибывает на ваш сайт (на любой странице), то вы можете либо установить куки или установить значение в LocalStorage, как только вы сделали анимацию один раз, а затем проверить это значение на последующих страницах, чтобы вы не отобразили анимацию снова. Вы можете контролировать истечение срока действия файла cookie или установить последнее посещенное значение в LocalStorage, чтобы определить, когда вы снова оживите.

источник

2014-01-03 23:12:32 jfriend00

jQuery анимация только на странице загрузка

ответ

Смежные вопросы