Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery] Wyświetlanie div w trybie ciągłym. Odporne na odświeżanie
Forum PHP.pl > Forum > Po stronie przeglądarki
ksiezulekwwo
14.04.2012, 15:17:22
Witam wszystkich
Od paru dni piszę stronę inetrnetową i potrzebuję skryptu który będzie na samym początku chował a potem po kolei wyświetlał divy.
Zastosowałem jquery no i wyszło: 

[HTML] pobierz, plaintext 
  1. <script>
  2.     $(document).ready(function() {
  3.       $("div.a1").slideUp(0).delay(100000).fadeIn(400);
  4.       $("div.a2").slideUp(0).delay(90000).fadeIn(400);
  5.       $("div.a3").slideUp(0).delay(80000).fadeIn(400);
  6.       $("div.a4").slideUp(0).delay(70000).fadeIn(400);
  7.       $("div.a5").slideUp(0).delay(60000).fadeIn(400);
  8.       $("div.a6").slideUp(0).delay(50000).fadeIn(400);
  9.       $("div.a7").slideUp(0).delay(40000).fadeIn(400);
  10.       $("div.a8").slideUp(0).delay(30000).fadeIn(400);
  11.       $("div.a9").slideUp(0).delay(20000).fadeIn(400);
  12.       $("div.a10").slideUp(0).delay(10000).fadeIn(400);
  13.     });
  14. </script>
[HTML] pobierz, plaintext

Jak widzimy skrypt wyświetla kolejne divy po określonym czasie, jednak ja chciałbym aby te divy były wyświetlane w sposób ciągły tj. nawet po odświeżeniu lub opuszczeniu chwilowo strony, a mój skrypt rzecz jasna zaczyna pracę od nowa po każdym ponownym załadowaniu. No i tutaj bardzo prosiłbym o jakąś pomoc, myślałem że może można coś z cookies porobić jednak nic mi nie wychodzi a nie chciałbym podpinać pod to żadnego php. Będę wdzięczny chociaż za jakieś sugestie jak to można zrobić, gdyż w jquery pracuję dopiero 1 dzień sad.gif
tolomei
14.04.2012, 17:08:21
Czyli za pierwszym razem, gdy użytkownik odwiedza stronę to ma mu zadziałać skrypt, a później już ma być cały czas widoczne normalnie tak?
Najbardziej pasowałoby tu utworzyć zmienną sesyjną.

[PHP] pobierz, plaintext 
  1. <?php
  2.     session_start();
  3. ?>
  4. <html>
  5.     <head>
  6.         <script type="text/javascript" src="jquery.js"></script>
  7.         <script type="text/javascript">
  8.             $(function(){
  9.                 <?php
  10.                     if(isset($_SESSION['skrypt'])) {
  11.                         echo 'var skrypt_start = 1;';
  12.                     } else {
  13.                         $_SESSION['skrypt'] = 1;
  14.                         echo 'var skrypt_start = 0;';
  15.                     }
  16.                 ?>
  17.                 if(skrypt_start == 1) {
  18.                     $("div.a1").slideUp(0).delay(100000).fadeIn(400);
  19.                     $("div.a2").slideUp(0).delay(90000).fadeIn(400);
  20.                     $("div.a3").slideUp(0).delay(80000).fadeIn(400);
  21.                     $("div.a4").slideUp(0).delay(70000).fadeIn(400);
  22.                     $("div.a5").slideUp(0).delay(60000).fadeIn(400);
  23.                     $("div.a6").slideUp(0).delay(50000).fadeIn(400);
  24.                     $("div.a7").slideUp(0).delay(40000).fadeIn(400);
  25.                     $("div.a8").slideUp(0).delay(30000).fadeIn(400);
  26.                     $("div.a9").slideUp(0).delay(20000).fadeIn(400);
  27.                     $("div.a10").slideUp(0).delay(10000).fadeIn(400);
  28.                 }
  29.             });
  30.         </script>
  31.     ...
[PHP] pobierz, plaintext


To jedna z możliwości.

Pozdrawiam.
ksiezulekwwo
14.04.2012, 21:11:33
Sorry, nie chce być upierdoliwy ale nie działa i nie mogę sobie poradzić z tym. Działa tylko sam skrypt ale bez "odporności na odświeżanie". To ma działać tak, użytkownik wchodzi uruchamia sie skrypt i działa przez określony czas ( ustawiony przeze mnie oczywiście), nawet jeżeli użytkownik odświeży stronę lub na chwilę ją opuści, ale wróci zanim skrypt nie skończy pracy.
Poniżej wklejam kod jaki dałem w pliku index.php, nie wywala błędów ale nie działa, może coś nie tak zrobiłem?

[HTML] pobierz, plaintext 
  1. <?php
  2.     session_start();
  3. ?>
  4. <html>
  5. <head>
  6.         <link type="text/css" rel="stylesheet" media="all" href="style.css">
  7.         <script src="http://code.jquery.com/jquery-latest.js"></script>
  8. </head>
  9. <body>
  10.         <script type="text/javascript">
  11.             $(function(){
  12.                 <?php
  13.                     if(isset($_SESSION['skrypt'])) {
  14.                         echo 'var skrypt_start = 1;';
  15.                     } else {
  16.                         $_SESSION['skrypt'] = 1;
  17.                         echo 'var skrypt_start = 0;';
  18.                     }
  19.                 ?>
  20.                 if(skrypt_start == 1) {
  21.                     $("div.a1").slideUp(0).delay(25000).fadeIn(400);
  22.                     $("div.a2").slideUp(0).delay(20000).fadeIn(400);
  23.                     $("div.a3").slideUp(0).delay(15000).fadeIn(400);
  24.                     $("div.a4").slideUp(0).delay(10000).fadeIn(400);
  25.                     $("div.a5").slideUp(0).delay(6000).fadeIn(400);
  26.  
  27.                 }
  28.             });
  29.         </script>
  30. <div class="a1">tekst1</div><br />
  31. <div class="a2">tekst1</div><br />
  32. <div class="a3">tekst1</div><br />
  33. <div class="a4">tekst1</div><br />
  34. <div class="a5">tekst1</div><br />
  35. </body>
  36. </html>
[HTML] pobierz, plaintext


I wogóle teraz sie skapłem że chyba źle mnie zrozumiałeś biggrin.gif bo twój kod kompletnie nie ma prawa działać tak jak chcę sad.gif
Może ktoś podsunie jakiś pomysł jak to można najprościej rozwiązać?
tolomei
14.04.2012, 21:45:28
Już rozumiem o co Ci chodzi.
Czyli jak odświeżę stronę dokładnie w połowie wykonywania się skryptu - to po przeładowaniu on dokończy swoje działanie dokładnie od miejsca w którym przerwał.

Tak ?
ksiezulekwwo
14.04.2012, 23:28:18
Dokładnie tak. smile.gif
tolomei
14.04.2012, 23:40:30
Trochę szalony pomysł, ale wykonalny.
Musiałbyś przynajmniej ze 2 razy na sekundę przesyłać ajaxem dane na temat czasu jaki pozostał kolejnym zdarzeniom do końca ich animacji.
Serwer automatycznie zapisywałby to w sesji tak, aby po przeładowaniu strony mógł ustawić konkretne czasy każdemu z elementów.

Może ktoś ma inny pomysł?
#luq
15.04.2012, 08:31:18
Cytat(tolomei @ 15.04.2012, 00:40:30 ) *
Może ktoś ma inny pomysł?

localStorage lub ciastka
tolomei
15.04.2012, 08:50:53
Możesz użyć zdarzenia onBeforeUnload w JavaScripcie. Zdarzenie potrafi wykryć, że okno dostało polecenie przeładowania/zamknięcia i na krótko przed tym potrafi wykonać jakąś funkcję jeszcze. W tej funkcji możesz wrzucić np. JSON-a do web storage i później to odczytać - dokładnie tak jak zaproponował #luq.
ksiezulekwwo
15.04.2012, 10:11:49
Cytat(tolomei @ 15.04.2012, 09:50:53 ) *
Możesz użyć zdarzenia onBeforeUnload w JavaScripcie. Zdarzenie potrafi wykryć, że okno dostało polecenie przeładowania/zamknięcia i na krótko przed tym potrafi wykonać jakąś funkcję jeszcze. W tej funkcji możesz wrzucić np. JSON-a do web storage i później to odczytać - dokładnie tak jak zaproponował #luq.


Dzięki za sugestie, spróbuje twoją metodą ale szczerze mówiąc dla mnie to trudne, narazie spróbuje na samych cookies to zrobić bez ajaxa, mam jeden pomysł i oby wyszło. A jeśli to to istnieje możliwość jakiejś pomocy z twojej strony? Jeżeli to nie skomplikowane to możemy sie umówić na jakąś zapłatę.
tolomei
15.04.2012, 10:19:45
Ja za pomoc na forum opłat nie pobieram smile.gif
Mogę Cię naprowadzić, ale będziesz musiał zrobić to sam.
ksiezulekwwo
15.04.2012, 10:34:14
Cytat(tolomei @ 15.04.2012, 11:19:45 ) *
Ja za pomoc na forum opłat nie pobieram smile.gif
Mogę Cię naprowadzić, ale będziesz musiał zrobić to sam.


No ok:D próbuje sam na cookies samych i javascript, mam tylko pytanie, czy jest możliwość zatrzymania wykonywania danego skryptu a konkretniej pętli w javascript? To znaczy bez spełnienia żadnych warunków nagle się ma zatrzymać. Napisałem kod który wysyła co pewien czas inne ciasteczko do użytkownika w trakcie jego pobytu na stronie i chciałbym aby po wysłaniu każdego nowego ciasteczka skrypt się zatrzymał i uruchomił dopiero po ponownym zaladowaniu strony.
tolomei
15.04.2012, 10:41:20
Zawsze możesz wstawić break; wewnątrz pętli. Po jego wystąpieniu następuje wyskok z pętli(działanie skryptu za pętlą jest kontynuowane).
O to pytałeś ?

Jak chcesz przerwać cały skrypt to najlepiej wsadzić ten skrypt w funkcję i wtedy dać odpowiednie polecenie return i funkcja zostanie zakończona.
ksiezulekwwo
15.04.2012, 10:49:31
Cytat(tolomei @ 15.04.2012, 11:41:20 ) *
Zawsze możesz wstawić break; wewnątrz pętli. Po jego wystąpieniu następuje wyskok z pętli(działanie skryptu za pętlą jest kontynuowane).
O to pytałeś ?

Jak chcesz przerwać cały skrypt to najlepiej wsadzić ten skrypt w funkcję i wtedy dać odpowiednie polecenie return i funkcja zostanie zakończona.


Tak o break mi chodziło właśnie dzięki smile.gif No nic idę kodzić i popróbuję, może coś wyjdzie, onBeforeUnload wolałbym nie używać, natomiast interesująca jest metoda z ajaxem, a jak wysyłać co 2 sekundy dane ? Można zastosować settimeout w javascript? I czy można to zapisać jakoś w cookies zamiast w sesji ? Ten ajax to bedzie alternatywa jakby nie wyszlo z samym cookies.
tolomei
15.04.2012, 11:03:20
Możesz użyć setTimeout() zarówno do żądań ajaxowych jak i do aktualizacji ciasteczek. Przy ciasteczkach miałbyś mniejsze straty czasu na pewno.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.