jquery spezifische show buttons auf schweben

Question

Ich habe eine Anwendung erstellen eine Reihe von divs durch eine Schleife.

Jedes div hat die Klasse "Produkt"

so sieht es aus wie

<div class="product"> 
     !.....stuff here ....! 
     <div class="show_on_hover">...buttons here... </div> 
</div> 

so gibt es etwa 12 dieser gleichen divs pro Seite sind.

Ich möchte über einen bestimmten schweben und zeigen Sie die spezifische "Show_on_hover" div, die anfänglich eingestellt ist, anzuzeigen: keine.

$('.product').hover(function() { 
    $(.show_on_hover).show(); 
    }, 
    function() { 
     $(.show_on_hover).hide(); 
    } 
); 

Das ist, was ich bisher habe, aber es wird alle der .show_on_hovers auf der Seite zeigen, so frage ich mich, wie nur die spezifischen, um Sie über zu zeigen moused haben. Dieser Effekt wird auf youtube angezeigt, wenn Sie einen der Mauszeiger über einen der Kommentare bewegen, und einige Kommentartools werden angezeigt.

Danke!

Answer 1

find finden Sie Ihre .show_on_hover divs in der schwebte .product. Versuchen Sie folgendes:

$('.product').hover(function() { 
     $(this).find('.show_on_hover').show(); 
    }, 
    function() { 
     $(this).find('.show_on_hover').hide(); 
    } 
); 

Answer 2

$ Versuchen ('show_on_hover.', This) .show()/hide()

den zweiten param auf die jQuery-Funktion hinzufügen, wird die Suche einschränken innerhalb davon zu sein. Element. In diesem Fall ist dies das div, auf das geklickt wird.