@dima_maketov
Мои тупые вопросы вносят вклад в сообщество.

Как переходя по ссылке с главной страницы открывать нужную вкладку аккордеона на внутренней?

Добрый день!
Скорее всего не понятно по названию, что необходимо, поэтому попробую объяснить примером:
Это главная страница, на которой есть несколько вариаций услуг
5a043674d223d646935238.png
При переходе по ссылке "Перевод документации", пользователя перекидывало на страницу "Письменного перевода"
с открытой вкладкой аккардеона:

5a0436fa58492033812549.png
Как можно сделать так, чтобы при переходе по ссылке скрипт понимал, какую вкладку аккардеона нужно открыть?
  • Вопрос задан
  • 1144 просмотра
Решения вопроса 3
iiiBird
@iiiBird Куратор тега HTML
Пока ты спишь - твой конкурент совершенствуется
делаешь у ссылок акордионов якоря, а потом через js обрабаываешь window.location.hash
Ответ написан
Комментировать
@dima_maketov Автор вопроса
Мои тупые вопросы вносят вклад в сообщество.
Спасибо за ответы, возможно кому-то понадобиться, реализовал так:
Главная страница, где есть ссылки:
<div class="link_list first_answ">
						<a href="/pismennyi-perevod.html#perevod-dokumentacii" class="service_name">Перевод документации</a>
						<a href="/pismennyi-perevod.html#korrektirovka" class="service_name">Корректировка документов</a>
						<a href="/pismennyi-perevod.html#redaktirovanie" class="service_name">Редактирование документов<br>(носителями языка) </a>
						<a href="/pismennyi-perevod.html#verstka" class="service_name">Верстка</a>
						<a href="/pismennyi-perevod.html#reraiting" class="service_name">Рерайтинг</a>
						<a href="/pismennyi-perevod.html#transkribirovanie" class="service_name">Транскрибирование</a>
						<a href="/pismennyi-perevod.html#notarialnoe-zaverenie" class="service_name">Нотариальное заверение<br>переводов </a>
						<a href="/pismennyi-perevod.html#dostavka-raspechatka" class="service_name">Доставка и распечатка<br>документов </a>
					</div>

Внутрення, где аккардеон:
<a href="#" class="service_name_item" data-name="perevod-dokumentacii">Перевод документации</a>
							<div class="service_content_item">
								<p><strong>Перевод документации</strong><br>Мы предлагаем перевод технической, медицинской, юридической и иной документации высококвалифицированными профильными специалистами.</p>
								<a href="#order" class="button magnific-popup blue_button" data-theme="Перевод документации">Получить консультацию по&nbsp;услуге</a>
							</div>
							<a href="#" class="service_name_item" data-name="korrektirovka">Корректировка документов</a>
							<div class="service_content_item">
								<p><strong>Корректировка документов</strong><br>Корректировка документа с целью устранения грамматических, орфографических, синтаксических ошибок, технических погрешностей</p>
								<a href="#order" class="button magnific-popup blue_button" data-theme="Корректировка документов">Получить консультацию по&nbsp;услуге</a>
							</div>

JQuery
if(window.location.hash){ //Проверяем, есть ли в ссылке, по которой перешел пользователь хэштег
		var $hash = window.location.hash, //получаем названием, например #verstka
			$hash_text = $hash.substr(1); // убираем первую строчку, т.е "#"
// далее мой код аккордеона
		$('.service_name_item').next().hide(); 
		$('.service_name_item[data-name="'+ $hash_text +'"]').addClass('active');  //я реализовал нахождение нужного объекта для показа через data-атрибуты(см. HTML)
//ищем есть ли .service_name_item с data-name'ом verstka, и даем ему класс active
		$('.service_name_item.active').next().show(); // открываем следующий блок(показываем содержимое вкладки аккордеона)
		$('.service_name_item').click(function(){
			if($(this).hasClass('active')){
			}else{
				$(this).addClass('active');
				$(this).next().slideToggle();
				$('.service_name_item').not(this).next().stop(true,true).slideUp();
				$('.service_name_item').not(this).removeClass('active');
			}
		});
	}
Ответ написан
Eridani
@Eridani
Мимо проходил
Передайте в ссылку GET параметр или делайте ссылку с хешем, а-ля /uslugi/#verstka
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы