Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Powrót do poprzedniej strony - przeglądarka
Forum PHP.pl > Forum > Przedszkole
bahh
Witam,

miałem dodać animację, że po kliknięciu dodaje wszystkim divom klasę (animacja na transition, że obraca główne divy o 180 stopni, że po obróceniu jest jednolity kolor strony) a po wykonaniu się tej akcji przekierowuje pod adres strony.

Oto kod:
[JAVASCRIPT] pobierz, plaintext
  1. //cut href to data-oldhref (we redirect after animation)
  2. $("#mainmenu .desktopmenu .sub-menu .menu-item a:not(.close), #mainmenu .desktopmenu .logo a").each(function() {
  3. $(this).attr("data-oldhref", $(this).attr("href"));
  4. //$(this).removeAttr("href");
  5. });
  6. $("#mainmenu .desktopmenu a:not(.close)").removeAttr("href");
  7. //animation in mainmenu before click link (flip effect)
  8. $("#mainmenu .desktopmenu .sub-menu .menu-item a:not(.close), #mainmenu .desktopmenu .logo a").click(function() {
  9. if ($(this).attr("data-oldhref") != "#")
  10. {
  11. //add class animate
  12. $("#mainmenu .card").eq(0).addClass("animate");
  13. $("#mainmenu .card").eq(4).addClass("animate");
  14. setTimeout(function() {
  15. $("#mainmenu .card").eq(1).addClass("animate");
  16. $("#mainmenu .card").eq(5).addClass("animate");
  17. }, 50);
  18. setTimeout(function() {
  19. $("#mainmenu .card").eq(2).addClass("animate");
  20. $("#mainmenu .card").eq(6).addClass("animate");
  21. }, 100);
  22. setTimeout(function() {
  23. $("#mainmenu .card").eq(3).addClass("animate");
  24. $("#mainmenu .card").eq(7).addClass("animate");
  25. }, 150);
  26. //redirect after animation
  27. var object = $(this);
  28. window.setTimeout(function() {
  29. window.location = $(object).attr("data-oldhref");
  30. }, 250);
  31. }
  32. });
[JAVASCRIPT] pobierz, plaintext

Zasada działania jest prosta - przenosi z href do data-oldhref (by link nie działał po klniknięciu), dodanie akcji po kliknieciu ze doje kasę animate do diva (w odpowiedniej kolejności wykonują się po kolei stąd settimeout) a gdy juz sie wykonają animacje (czyli po 250ms) to przekierowuje na adres zawarty w data-oldhref.

Wszytko ładnie działa, ale na Mozilli i Safari, gdy powrocimy do poprzedniej strony (strzałeczka w lewo w przeglądarce) to wyświetla stronę po animacji (w tym przypadku jednolity kolor - taki jak po wykonaniu powyższego skryptu z klasą animate), gdzie w Chrome po powrocie strona jest ładowana od nowa (także wszystko działa). Jak temu zaradzić?

Znalazłem rozwiązanie tutaj:
http://stackoverflow.com/questions/2638292...script-wont-run

Wystarczyło dać ten kod, gdzie dodatkowo dorzuciłem przeładowanie strony, także wczytuje się od nowa

[JAVASCRIPT] pobierz, plaintext
  1. $(window).bind("pageshow", function(event) {
  2. if (event.originalEvent.persisted) {
  3. location.reload();
  4. }
  5. });
[JAVASCRIPT] pobierz, plaintext
Tomplus
Czasem lepiej od razu poszukać na googlach a potem zadać pytanie tutaj tongue.gif
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.