Помогите исправить аккордион
НЕ могу понять вроде все на месте, но не работает. Помогите пожалуйста разобраться
var toggle_parent = $(this).closest('.detail-wrapper-anons-day-item');
if (toggle_parent.hasClass('tab-core-active')) {
toggle_parent.removeClass('tab-core-active');
$(this).siblings('.detail-wrapper-anons-day-item-content').children('.detail-wrapper-anons-item-tab').css({
display: 'block'
}).slideUp(200);
} else {
toggle_parent.addClass('tab-core-active');
$(this).siblings('.detail-wrapper-anons-day-item-content').children('.detail-wrapper-anons-item-tab').css({
display: 'none'
}).slideDown(200);
}
|
Kurt_D_Cobain,
:-? |
вот сам html
<div class="detail-wrapper-anons core-toggle-tab">
<div class="detail-wrapper-anons-day-item tab-core-active">
<div class="detail-wrapper-anons-day-item-content">
<h5 class="detail-wrapper-anons-day">
<span class="detail-wrapper-anons-day-title">День 1</span>
Россия, Новосибирск
</h5>
<div class="detail-wrapper-anons-item-tab">
<p class="detail-wrapper-anons-item-text">
Путевки в Турцию популярны во всем мире, а большое разнообразие цен позволит
всем путешественникам найти свое место на пляже.
предлагает туры в Турцию самой разной продолжительности. Вы можете
отправиться
отдыхать на неделю или две на Анталийское побережье, уехать в экскурсионный
тур в
Стамбул или два месяца отдыхать на курортах Эгейского моря. Воспользуйтесь
системой
подбора тура и выберите свой отдых!
</p>
</div>
</div>
</div>
</div>
|
Kurt_D_Cobain,
без клика? |
Kurt_D_Cobain,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css"> .tab-core-active {
background-color: #EEE8AA;
}
.detail-wrapper-anons-item-tab{
overflow: hidden;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$( '.core-toggle-tab' ).each(function() {
var tab = $(this);
tab.on('click', '.detail-wrapper-anons-day', function() {
var toggle_parent = $('.detail-wrapper-anons-day-item', tab);
toggle_parent.toggleClass('tab-core-active');
$('.detail-wrapper-anons-item-tab', toggle_parent).slideToggle(200)
})
});
});
</script>
</head>
<body>
<div class="detail-wrapper-anons core-toggle-tab">
<div class="detail-wrapper-anons-day-item tab-core-active">
<div class="detail-wrapper-anons-day-item-content">
<h5 class="detail-wrapper-anons-day">
<span class="detail-wrapper-anons-day-title">День 1</span>
Россия, Новосибирск
</h5>
<div class="detail-wrapper-anons-item-tab">
<p class="detail-wrapper-anons-item-text">
Путевки в Турцию популярны во всем мире, а большое разнообразие цен позволит
всем путешественникам найти свое место на пляже.
предлагает туры в Турцию самой разной продолжительности. Вы можете
отправиться
отдыхать на неделю или две на Анталийское побережье, уехать в экскурсионный
тур в
Стамбул или два месяца отдыхать на курортах Эгейского моря. Воспользуйтесь
системой
подбора тура и выберите свой отдых!
</p>
</div>
</div>
</div>
</div>
</body>
</html>
|
Спасибо, то что надо, а подскажи еще момент, как заставить несколько таких табов работать вместе но каждый открывает и закрывает себя?
|
Цитата:
|
Все вместе открываются и закрываются при клике на любой, спасибо за помошь!
|
Kurt_D_Cobain,
html на два три блока покажите |
<div class="detail-wrapper-anons-day-item tab-core-active">
<div class="detail-wrapper-anons-day-item-content">
<h5 class="detail-wrapper-anons-day">
<span class="detail-wrapper-anons-day-title">День 1</span>
Россия, Новосибирск
</h5>
<div class="detail-wrapper-anons-item-tab">
<p class="detail-wrapper-anons-item-text">
Путевки в Турцию популярны во всем мире, а большое разнообразие цен позволит
всем путешественникам найти свое место на пляже.
предлагает туры в Турцию самой разной продолжительности. Вы можете
отправиться
отдыхать на неделю или две на Анталийское побережье, уехать в экскурсионный
тур в
Стамбул или два месяца отдыхать на курортах Эгейского моря. Воспользуйтесь
системой
подбора тура и выберите свой отдых!
</p>
</div>
</div>
</div>
<div class="detail-wrapper-anons-day-item">
<div class="detail-wrapper-anons-day-item-content">
<h5 class="detail-wrapper-anons-day">
<span class="detail-wrapper-anons-day-title">День 2</span>
Турция, Анталия
</h5>
<div class="detail-wrapper-anons-item-tab">
<p class="detail-wrapper-anons-item-text">
Путевки в Турцию популярны во всем мире, а большое разнообразие цен позволит
всем путешественникам найти свое место на пляже.
предлагает туры в Турцию самой разной продолжительности. Вы можете
отправиться
отдыхать на неделю или две на Анталийское побережье, уехать в экскурсионный
тур в
Стамбул или два месяца отдыхать на курортах Эгейского моря. Воспользуйтесь
системой
подбора тура и выберите свой отдых!
</p>
</div>
</div>
</div>
<div class="detail-wrapper-anons-day-item">
<div class="detail-wrapper-anons-day-item-content">
<h5 class="detail-wrapper-anons-day">
<span class="detail-wrapper-anons-day-title">День 1</span>
Россия, Новосибирск
</h5>
<div class="detail-wrapper-anons-item-tab">
<p class="detail-wrapper-anons-item-text">
Путевки в Турцию популярны во всем мире, а большое разнообразие цен позволит
всем путешественникам найти свое место на пляже.
предлагает туры в Турцию самой разной продолжительности. Вы можете
отправиться
отдыхать на неделю или две на Анталийское побережье, уехать в экскурсионный
тур в
Стамбул или два месяца отдыхать на курортах Эгейского моря. Воспользуйтесь
системой
подбора тура и выберите свой отдых!
</p>
</div>
</div>
</div>
<div class="detail-wrapper-anons-day-item">
<div class="detail-wrapper-anons-day-item-content">
<h5 class="detail-wrapper-anons-day">
<span class="detail-wrapper-anons-day-title">День 2</span>
Турция, Анталия
</h5>
<div class="detail-wrapper-anons-item-tab">
<p class="detail-wrapper-anons-item-text">
Путевки в Турцию популярны во всем мире, а большое разнообразие цен позволит
всем путешественникам найти свое место на пляже.
предлагает туры в Турцию самой разной продолжительности. Вы можете
отправиться
отдыхать на неделю или две на Анталийское побережье, уехать в экскурсионный
тур в
Стамбул или два месяца отдыхать на курортах Эгейского моря. Воспользуйтесь
системой
подбора тура и выберите свой отдых!
</p>
</div>
</div>
</div>
|
| Часовой пояс GMT +3, время: 02:29. |