Помогите разобраться.
На сайте сделал список что то в виде этого
http://anton.shevchuk.name/wp-demo/j...ccordion1.html
теперь мне надо сделать так, что бы каждый элемент можно было удалить,
наподобии этого
http://anton.shevchuk.name/wp-demo/j...-comments.html
Как получилось у меня
$(document).ready(function(){
$(".accordion h3:first").addClass("active");
$(".accordion p:not(:first)").hide();
$(".accordion h3").click(function(){
$(this).next("p").slideToggle("slow")
.siblings("p:visible").slideUp("slow");
$(this).toggleClass("active");
$(this).siblings("h3").removeClass("active");
});
});
<div class="accordion">
<h3 class='toggler'>Заголовок 1</div></h3>
<p class='not_pad'>Показываемый текст1</p>
<h3 class='toggler'>заголовок2</h3>
<p class='not_pad'>Показываемый текст2</p>
аккордион заработал,
теперь пытаюсь сделать удаление элементов,
дописываю код
$(document).ready(function(){
$(".pane:even").addClass("alt");
$(".pane .btn-spam").click(function(){
$(this).parents(".pane").animate({ backgroundColor: "#fbc7c7" }, "fast")
.animate({ opacity: "hide" }, "slow")
return false;
});
});
в странице:
<div class="accordion"><div class="pane">
<h3 class='toggler'>Заголовок 1</h3>
<p class='not_pad'>Показываемый текст1 <a href="#" class="btn-spam">Delete</a></p></div>
<div class="pane"><h3 class='toggler'>заголовок2</h3>
<p class='not_pad'>Показываемый текст2 <a href="#" class="btn-spam">Delete</a></p></div>
сначала обрадовался, вроде как все заработало, но один косяк, перестал работать акардион, точнее стал неправильно работать: если клацнуть на заголовок h3(неразвернутый), то он развернется, но при этом заголовок h3 который был развернут не сворачивается, если убрать все <div class="pane"></div>, то аккордион работает нормально.
может у кого есть идеи, как это можно реализовать?
