Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] wysuwane menu
Forum PHP.pl > Forum > Przedszkole
avengers
  1. $(function(){
  2. $(".link1").css("left","-20px");
  3. $(".slink1").toggle(function(){
  4. $(".wysuniety").animate({left: "-20px"}, 700 );
  5. $(".wysuniety").removeClass("wysuniety");
  6. $(".link1").addClass("wysuniety");
  7. $(".link1").animate({left: "192px"}, 500 );
  8. return false;
  9. },
  10. function(){
  11. $(".link1").animate({left: "-20px"}, 500 );
  12. return false;
  13. });
  14. });
  15. $(function(){
  16. $(".link2").css("left","-20px");
  17. $(".slink2").toggle(function(){
  18. $(".wysuniety").animate({left: "-20px"}, 700 );
  19. $(".wysuniety").removeClass("wysuniety");
  20. $(".link2").addClass("wysuniety");
  21. $(".link2").animate({left: "192px"}, 500 );
  22. return false;
  23. },
  24. function(){
  25. $(".link2").animate({left: "-20px"}, 500 );
  26. return false;
  27. });
  28. });
  29. $(function(){
  30. $(".link3").css("left","-20px");
  31. $(".slink3").toggle(function(){
  32. $(".wysuniety").animate({left: "-20px"}, 700 );
  33. $(".wysuniety").removeClass("wysuniety");
  34. $(".link3").addClass("wysuniety");
  35. $(".link3").animate({left: "192px"}, 500 );
  36. return false;
  37. },
  38. function(){
  39. $(".link3").animate({left: "-20px"}, 500 );
  40. return false;
  41. });
  42. });


Ponieważ rozpoczynam działanie na jquery chciałbym zrobić slider który wysuwa się w prawą stronę po zaznaczeniu odpowiedniego linku z klasą (np. slink1 dla linku 1). Następnie ma on za zadanie wysunąć div o klasie link (np. link1). Wszystko działa ok do póki nie próbóję powtórzyć działania tzn. przełączając między 1, potem 2 i 3 działa ok, ale gdy klikam ponownie 2 to już muszę tą akcję powtórzyć jeszcze raz, by slider się zmienił.
avengers
Za radą z przypiętego tematu dodaję stronę gdzie można zobaczyć efekt i wprowadzić korektę
http://jsbin.com/aqejen/edit#preview

Z góry dziękuję
avengers
Błąd okazał się prostszy niż przypuszczałem, wystarczyło zamienić toggle na click i skasować niepotrzebną część.

Teraz pozostaje jeszcze kwestia co zrobić, by po kliknięciu gdy już element jest wysunięty, ponowne kliknięcie spowodowało zamknięcie i nie wysuwanie niczego.

Czy jest możliwe (a zapewne jest) zrobienie czegoś na wzór if z php? Chciałbym to wykonać tak, po kliknięciu w 1 link - jeśli link1 nie posiada klasy ".wysuniety" to wykonaj
  1. $(".link1").addClass("wysuniety");
  2. $(".link1").animate({left: "192px"}, 500 );

jeśli posiada to wykonaj
  1. $(this).removeClass("zamknij"); -- to odpowiada strzałeczki z hrefa


na 99% z tym kodem który obecnie mam by bez problemu to zadziałalo, prosiłbym tylko o wskazanie jak to zrobić.
avengers
Na necie znalazłem coś takiego:
  1. if (!$(this).hasClass("selected")) {
  2. //do stuff
  3. }

i działa. Trochę monolog z tego wyszedł ale nic, może komuś na przyszłość się przyda biggrin.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.