Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [jQuery]slideToggle() - problem z kolejkowaniem
vonski
post
Post #1





Grupa: Zarejestrowani
Postów: 292
Pomógł: 89
Dołączył: 27.12.2006
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


Witam.
Robię sobie rozwijane menu za pomocą jQuery, a konkretnie funkcji slideToggle(). Podgląd na żywo dostępny jest tutaj:
http://tomek.rychtyk.pl/workshop/afryka/product.html - chodzi o ten zielony button 'Wybierz opakowanie'.
Niby wszystko wygląda ok - po najechaniu kursorem ładnie rozwija się menu z gramaturami, po "zdjęciu" kursora, menu się zwija. Problem w tym, że jQuery kolejkuje te "najechania" myszką i przez to, jeśli szybko przewinę kursorem w dół i w górę (w obrębie przycisku oczywiście) to owe menu będzie się wysuwać i wsuwać i tak aż do wykonania wszystkich "najechań".
Inna rzecz: jak najadę na 'Wybierz opakowanie' a później szybko na którąś z gramatur (na tyle szybko by menu nie zdążyło się całe rozwinąć) to jest podobny problem do opisanego powyżej.

Kod JS:

  1. $(".pack").hover(function()
  2. {
  3. $(".ribbon").slideToggle("slow");
  4. $(".grams-list li").each(function() { $(this).removeClass("glActive"); });
  5. });


Próbowałem dodać przed wywołaniem slideToggle: stop(true, true) - nie pomogło.
Próbowałem z $(".ribbon").clearQueue(); oraz $(".ribbon").dequeue() - też lipa.
Tzn. w przypadku dwóch ostatnich prób to "pomogło" o tyle, że nie kolejkowało najechań myszką na button, ale za to.. po jednej animacji w ogóle już nie reagowało na hover.
Aha, apropo animacji, to próbowałem też zastąpić slideToggle() funkcją animate() mniej więcej w ten sposób:

  1. $(".ribbon").animate({height:"toggle", opacity:"toggle"}, "slow");


i efekt był ten sam :/

Mam już dość.
Spotkał się ktoś może z tym problemem i ma jakiś skuteczny lek na to?
Z góry dzięki

Pozdrawiam


--------------------
Zend Certified Engineer | Microsoft Certified Professional: Programming in HTML5 with JavaScript & CSS3 | Blog
Go to the top of the page
+Quote Post
wookieb
post
Post #2





Grupa: Moderatorzy
Postów: 8 989
Pomógł: 1550
Dołączył: 8.08.2008
Skąd: Słupsk/Gdańsk




Dla tego elementu dodaj sobie jakąś flagę typu 'inToggleAnimation' która przy wywołaniu toggle ustawiasz na "true". Po zakończeniu animacji na false. Dzięki temu sprawdzisz czy możesz po raz kolejny wywołać slideToggle.

P.s. Flage możesz zapisać używajać .data('klucz', 'wartosc') na elemencie.

Ten post edytował wookieb 7.12.2010, 11:07:24


--------------------
Go to the top of the page
+Quote Post
batman
post
Post #3





Grupa: Moderatorzy
Postów: 2 921
Pomógł: 269
Dołączył: 11.08.2005
Skąd: 127.0.0.1




[JAVASCRIPT] pobierz, plaintext
  1. $(".ribbon").not(":animated").slideToggle("slow");
[JAVASCRIPT] pobierz, plaintext
To powinno załatwić sprawę.


--------------------
I would love to change the world, but they won't give me the source code.
My software never has bugs. It just develops random features.
Go to the top of the page
+Quote Post
vonski
post
Post #4





Grupa: Zarejestrowani
Postów: 292
Pomógł: 89
Dołączył: 27.12.2006
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


Dzięki za odpowiedzi.

Batman: działa super, jeszcze raz dzięki smile.gif


--------------------
Zend Certified Engineer | Microsoft Certified Professional: Programming in HTML5 with JavaScript & CSS3 | Blog
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 22.08.2025 - 01:08