Kluci jak byste pokracovali dal? Potrebuju aby se classa .top vratila po klinuti zpet na puvodni pozici.
Kód: Vybrať všetko
$('.top').addClass('down');
$("a.detail").click( function(event){
event.preventDefault();
if ($(".top").hasClass("down")) {
$(this).parent().stop().animate({top:'-288px'}).removeClass('down');
} else {
}
return false;
});
Kód: Vybrať všetko
<div class="product box">
<div class="top">
<img src="/assets/img/icon-1.png" alt="Monitoring" />
<h2>Monitoring</h2>
<p>Nam et natum moderatius, utinam omnium interpretaris ea pro, brute consequuntur pro ne.
Ne vim soluta philosophia.</p>
<a class="detail" href="">Detail</a>
</div>
</div>
Tak jsem jeste zapatral na netu a nasel jsem tohle. Ale jak definovat this? Budu mit na webu 3 takove boxy a chci aby se po kliknuti animoval jen ten jeden.
Pokud to zapisu takhle: $("a.detail").on('click', '.top' function() { ..... Tak to prestane fungovat
Tusite nekdo co s tim?
Kód: Vybrať všetko
$("a.detail").on('click', function() {
if($(this).hasClass('selected')) {
$(".top").stop().animate({
top: "-288px"
});
$(this).removeClass("selected");
} else {
$(".top").stop().animate({
top: "0px"
});
$(this).addClass("selected");
}
return false;
});
Tak nakonec jsem nasel script ktery funguje. Moc mu sice nerozumim hlavne tomuhle radku: top: selected? "-288px" : "0px". Co je ten otaznik? To je nejaky zkraceny zapis?
Kód: Vybrať všetko
$(".top").on("click", "a.detail", function (e) {
var selected = $(this).hasClass("selected");
$(e.delegateTarget).stop().animate({
top: selected? "-288px" : "0px"
});
$(this).toggleClass("selected", !selected);
return false;
});
Kód: Vybrať všetko
<div class="product box">
<div class="top">
<img src="/assets/img/icon-1.png" alt="Monitoring" />
<h2>Monitoring</h2>
<p>Nam et natum moderatius, utinam omnium interpretaris ea pro, brute consequuntur pro ne.
Ne vim soluta philosophia.</p>
<a class="detail selected" href="">Detail</a>
</div>
</div>
