jQuery açılan CSS

Question

Hey, gitmek eğer sorunları . Ne yapabileceğime dair önerilerin var mı? Sanırım bir zamanlar diğer slaytlar yerini aldığından beri. Animate() slideDown kullanmamalı mıyım?

Answer 1

yerine .slideDown() ve .slideUp() deneyin sırasıyla kullanmak: Eğer daha iyi çalışmasını sağlamak için çok gibi değiştirebilir,

$(".button").hover(function() { 
    $(this).find(".info").slideDown(); 
}, function() { 
    $(this).find(".info").slideUp(); 
}); 

Veya: kolay javascript yapar

$(yourElementHere).stop().animate({ top: "20px", opacity: "1" }, 500, "swing"); 

ve

$(yourElementHere).stop().animate({ top: "-180px", opacity: "0" }, 500, "swing"); 

Answer 2

bu deneyin:

$(document).ready(function() { 
    $('.btn-fishing-trip').hover(function() { 
     $('.fishing-trip').slideDown("slow"); 
     $('.combo').slideUp("slow"); 
    });  
    $('.btn-combo').hover(function() { 
     $('.combo').slideDown("slow"); 
     $('.fishing-trip').slideUp("slow"); 
    }); 
}); 

Answer 3

Hala gerçekten yararlı slideDown, slideUp kullanabilirsiniz. Bence senin problemin .hover ile., Ve sonra mouseout ile geri çağır. Çünkü şimdi, tekrar tekrar döneceğinden, sürgüyü durduracak olayın düzgün bir şekilde aranmadığı anlaşılıyor. Ayrıca, ne olduğunu tahmin etmenin asılsızlığını alamıyorum, sanırım bazı unsurları karıştırdınız. Gizlenmeleri veya göstermeleri gereken ve de .hasClass(); Belli bir sınıfa sahip olup olmadıklarını kontrol etmek istediğinizde, bu şekilde yukarı veya aşağı kaydırmanız gerekip gerekmediğini belirleyebilirsiniz.

Answer 4

Her şeyden önce, tek tek öğeler için sınıfınız yok. Bunları kimlikleri kullanarak ayrı ayrı stilleyebilir ve aynı sınıftaki tüm nesneler için tek bir hover işlevine sahip olabilirsiniz (dört kez kopyalayıp yapıştırmadan farklı olarak).

<div class="button" id="btn1"> 
    <div class="info"><img src="info1"></img></div> 
</div> 
<div class="button" id="btn2"> 
    <div class="info"><img src="info2"></img></div> 
</div> 
... 

Sen düğmelerin çocuklar gibi ".info" unsurları olması gerekmez, ancak benzersiz olmadan erişilebilir olması gerekir:

İkinci kapalı, burada olması gereken temel yapı var id (yani bir sonraki eleman veya çocuk).

$(".button").hover(function() { 
    $(".info").not(".info", $(this)).slideUp(); // Not sure if valid JQ 
    $(this).find(".info").slideDown(); 
});