@vetalsd2
front-end Trainee

Аккордион на jQuery?

Не получается реализовать аккордион. Где-то допустил ошибку. Неактивные теги p не слайдятся SlideUp
<div class="container">
			<h3><?php pll_e('h3_4'); ?></h3>
			<div class="row">
				<div class="col-md-4">
					<div class="eco_item">
						<h4><?php pll_e('eco_h_1'); ?></h4>
						<p><?php pll_e('eco_p_1'); ?></p>
						<span>1</span>
					</div>
				</div>
				<div class="col-md-4">
					<div class="eco_item">
						<h4><?php pll_e('eco_h_2'); ?></h4>
						<p><?php pll_e('eco_p_2'); ?></p>
						<span>2</span>
					</div>
				</div>
				<div class="col-md-4">
					<div class="eco_item">
						<h4><?php pll_e('eco_h_3'); ?></h4>
						<p><?php pll_e('eco_p_3'); ?></p>
						<span>3</span>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-md-4">
					<div class="eco_item">
						<h4><?php pll_e('eco_h_5'); ?></h4>
						<p><?php pll_e('eco_p_5'); ?></p>
						<span>4</span>
					</div>
				</div>
				<div class="col-md-4 hidden-sm hidden-xs">
					<div class="eco_item">
						<img src="<?php echo get_template_directory_uri(); ?>/img/eco_main.png" alt="">
					</div>
				</div>
				<div class="col-md-4">
					<div class="eco_item">
						<h4><?php pll_e('eco_h_7'); ?></h4>
						<p><?php pll_e('eco_p_7'); ?></p>
						<span>5</span>
					</div>
				</div>
			</div>
                   </div>

$('.eco .col-md-4').on('click', '.eco_item h4', function(){
			var eco = $(this).closest('.eco_item');
			eco.find('p').slideDown();
			eco.siblings().find('p').slideUp();
		});
  • Вопрос задан
  • 92 просмотра
Пригласить эксперта
Ответы на вопрос 1
@justdealman
Для 'eco' и нет соседних элементов, надо как-то так:

$('.eco .col-md-4').on('click', '.eco_item h4', function() {
	var eco = $(this).closest('.eco_item').find('p');
	if ( eco.is(':hidden') ) {
		$(this).closest('.container').find('.eco_item p').slideUp();
		eco.slideDown();
	}
});
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы