Привязка галереи к меню

  • 5 Ответов
  • 454 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

Привязка галереи к меню
« : 20.12.2015, 22:50:52 »
Добрый вечер. Очень нужна помощь. Необходимо сделать галерею с привязкой в меню. Что бы нажимая на картинку она увеличивалась, а необходимо меню подсвечивалось (становилось активным).
Может кто-то с этим сталкивался, или хоть подскажите в каком направлении копать.....Очень нужно. Заранее спасибо

Re: Привязка галереи к меню
« Ответ #1 : 21.12.2015, 08:35:45 »
Неужели никто не сталкивался с таким?

*

Оффлайн 12mv

  • *****
  • 526
  • [+]20 / [-]0
  • Гульсина
    • Просмотр профиля
Re: Привязка галереи к меню
« Ответ #2 : 21.12.2015, 10:19:26 »
Ну так привяжите её к пункту меню, редактирование/создание пункта меню - тип меню http://prntscr.com/9go23z

Re: Привязка галереи к меню
« Ответ #3 : 15.01.2016, 18:19:52 »
Это я знаю. Я создала меню аккордеон. Вот тестовый сайт http://746584.avtogr06.web.hosting-test.net/. При нажатии на главной странице на фото осуществляется переход на другую страницу и в аккордеоне должен выделяться пункт меню (которые сейчас уже выделяется). Но проблема теперь следующая - если ссылку делать на подпункт, то меню аккордеона не раздвигается.

Re: Привязка галереи к меню
« Ответ #4 : 15.01.2016, 19:09:06 »
И вот скрипт, благодаря которому, подсвечиваются активные пункты меню. <script type="text/javascript">
jQuery(document).ready(function() {
   var url = window.location.href.split('//')[1];
   var link = url.replace('746584.avtogr06.web.hosting-test.net', '');
   var seg = url.split('/');
   console.log(url);
   jQuery("a[href='http://"+url+"']").css({color: "#B49E7F" });
   if(seg.length == 4){
      
      jQuery("a[href='"+link+"']").closest(".dcjq-parent").css({display: "block"});
   }
})
</script>

Re: Привязка галереи к меню
« Ответ #5 : 19.01.2016, 22:17:20 »
Отвечаю сама на свой вопрос
Были неправильно подключены файлы, поэтому аккордеон не работал.
Заменила вот этот код
<script type="text/javascript">
jQuery(document).ready(function() {
var url = window.location.href.split('//')[1];
var link = url.replace('746584.avtogr06.web.hosting-test.net', '');
var seg = url.split('/');
console.log(url);
jQuery("a[href='http://"+url+"']").css({color: "#B49E7F" });
if(seg.length == 4){

jQuery("a[href='"+link+"']").closest(".dcjq-parent").css({display: "block"});
}
})
</script>

на

jQuery(function() {
// определяем совпадения URL текущей страницы и ссылок меню
// присваиваем к совпавшим новый класс
var linkMenu = jQuery('.accordion .accord > li > a');
linkMenu.each(function() {
var position = window.location.href;
var link = this.href;
var linkHahs = window.location.hash;
var linkSearch = window.location.search;
if(position == link ||
position == link + linkHahs ||
position == link + linkSearch ||
position == link + linkSearch + linkHahs)
{
$(this).parent('li').addClass('current');
}
});

var accordion_head = $('.accordion > li > a'),
accordion_body = $('.accordion li > .accord'),
accordion_link = $('.accordion li > .accord > li.current'); //переменная текущего пункта меню

//открываем раздел где найдена текущая ссылка
//добавляем класс к заголовку открытого раздела

accordion_link.each(function(){
jQuery(this).parent().slideToggle();
jQuery(this).parent().parent().children('a').addClass('active');
});

accordion_head.on('click', function(event) {
event.preventDefault();
if (jQuery(this).attr('class') == 'active'){
accordion_body.slideUp('normal')
$(this).removeClass('active');
return false;
}
if (jQuery(this).attr('class')!= 'active'){
accordion_body.slideUp('normal');
jQuery(this).next().stop(true,true).slideToggle('normal');
accordion_head.removeClass('active');
jQuery(this).addClass('active');

}

});
});


В принципе при переходе меню стало раздвигаться активный пункт подсвечивается.


При этом возникла проблема - когда переходишь по пунктам меню аккордеон закрывается.
Пожалуйста, кто может натолкните на правильный пункт...Уже третью неделю бьюсь головой об стенку !