Witam,
Szukałem po sieci, jednak nic konkretnego nie znalazłem - dlatego zwracam się do was o jakieś linki / wytłumaczenie problemu.

Robiąc skrypt w jQuery często borykam się z problemem dot. ilości instancji danego elementu.

Kod który potrafię przygotować działa tylko do 1 elementu, chcąc utworzyć kolejny muszę zmienić nazwy elementów - jak przygotować skrypt który pozwoli mi np. wykorzystać go n razy na danej podstronie?


Zwykle udało mi się to ominąć, lub nie było ich tyle żeby nie móc przekopiować - choć była to robota strasznie możolna - i zapewne znacznie wpływała na obciążenie strony.
Teraz postanowiłem dodać przyciski do produktów na stronie i nie jestem w stanie przewidzieć ile będzie w danej kategorii:

W skrypcie zastosowałem hoverIntent - ponieważ przy zwykłym hover lub mouseover skrypt można było łatwo zapętlić, jednak powoduje to delikatne opóźnienie.
Czy jest inna opcja by zabezpieczyć przycisk przed bezsensownym miganiem, a przyśpieszyć jego reakcję?
LINK DO HOVER INTENT


Z góry dziękuje i pozdrawiam.

[PHP] pobierz, plaintext 
$("div.buynowbutton").hoverIntent(function() {
$(this).fadeTo('fast', 0.6, function() {
$(this).css("background-image","url('images/buynowprice.png')");
$("div.buynow").hide();
$("div.showtheprice").show();
}).fadeTo('slow', 1);
}, function(){
$(this).fadeTo('fast', 0.6, function() {
$(this).css("background-image","url('images/buynow.png')");
$("div.buynow").show();
$("div.showtheprice").hide();
}).fadeTo('slow', 1);
});
[PHP] pobierz, plaintext 

[HTML] pobierz, plaintext 
     <div class="buynowbutton">
	 <a href="http://justinbieber.com">
		<div class="buynow">KUP TERAZ</div>    
        <div class="showtheprice">110,00 PLN</div>
	</a>
    </div> 
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
  <style>
  .buynowbutton a:link, a:visited {
  display:block;
  text-decoration: none;
  }
  .buynowbutton {
  height: 47px;
  width: 166px;
  background: url('images/buynow.png') no-repeat;
  }
  .buynowbutton .buynow {
   color: white;
   font-weight: 800;
   font-size: 17px;
   position: relative;
   left: 55px;
   top: 12px;
  }
  .buynowbutton .showtheprice {
   color: white;
   font-weight: 800;
   font-size: 17px;
   position: relative;
   left: 55px;
   top: 12px;
   display: none;
  }
 
 
    .buynowbutton1 a:link, a:visited {
  display:block;
  text-decoration: none;
  }
  .buynowbutton1 {
  height: 47px;
  width: 166px;
  background: url('images/buynow.png') no-repeat;
  }
  .buynowbutton1 .buynow1 {
   color: white;
   font-weight: 800;
   font-size: 17px;
   position: relative;
   left: 55px;
   top: 12px;
  }
  .buynowbutton1 .showtheprice1 {
   color: white;
   font-weight: 800;
   font-size: 17px;
   position: relative;
   left: 55px;
   top: 12px;
   display: none;
  }
  </style>
[HTML] pobierz, plaintext 

użyj .stop(); np.



Pozwoli ci to uniknąć zapętlania się efektów jQuery