Не работает magnificPopup в шаблоне от codyhouse
Всем привет, очень нужна помощь, начал я создавать небольшой сайт на исходниках https://codyhouse.co/gem/3d-folding-panel/, и столкнулся с проблемой, скрипты и модули что я добавляю не работают. Обстоит все так, магнифик отлично открывает форму и выполняет свою работу на главной странице( где и находится галерея) при клике на раздел разворачивается "item-1.html" на этой же странице( как это все реализуется я не знаю, я только новичок), там находится контент(текст и фото) если с текстом проблем не было да и с фото тоже(они редактируются в "item-1.html") то js код отказывается работать, уточню что только тот код что я добавил, то есть фотки через магнифик он не открывает. Пробовал реализовать галерею, то же самое, код не активен.
Что только не пробовал, единственный признак жизни подал вот такой код foldingPanel.on('click', '.foto', function(event){ $(".foto").magnificPopup({ type : "image", gallery : { enabled : true } }); });и в вместо href="img.jpg" href="#" <a href="#" class="foto"> <img src="img/1.jpg" alt=""> </a>, тогда нужно было бы два раза нажать на фотку и она бы открывалась( с ошибкой конечно) но зато другие бы норм работали, причем если кликать на ту у которой href="img.jpg" - она бы не работала вообще. |
http://belovoloff.esy.es/ - это сайт
|
jQuery(document).ready(function($){ $(".foto").magnificPopup({ type : "image", gallery : { enabled : true } }); var gallery = $('.cd-gallery'), foldingPanel = $('.cd-folding-panel'), mainContent = $('.cd-main'); /* open folding content */ gallery.on('click', 'a', function(event){ event.preventDefault(); openItemInfo($(this).attr('href')); }); foldingPanel.on('click', '.foto', function(event){ $(".foto").magnificPopup({ type : "image", gallery : { enabled : true } }); }); /* close folding content */ foldingPanel.on('click', '.cd-close', function(event){ event.preventDefault(); toggleContent('', false); }); gallery.on('click', function(event){ /* detect click on .cd-gallery::before when the .cd-folding-panel is open */ if($(event.target).is('.cd-gallery') && $('.fold-is-open').length > 0 ) toggleContent('', false); }) function openItemInfo(url) { var mq = viewportSize(); if( gallery.offset().top > $(window).scrollTop() && mq != 'mobile') { /* if content is visible above the .cd-gallery - scroll before opening the folding panel */ $('body,html').animate({ 'scrollTop': gallery.offset().top }, 100, function(){ toggleContent(url, true); }); } else if( gallery.offset().top + gallery.height() < $(window).scrollTop() + $(window).height() && mq != 'mobile' ) { /* if content is visible below the .cd-gallery - scroll before opening the folding panel */ $('body,html').animate({ 'scrollTop': gallery.offset().top + gallery.height() - $(window).height() }, 100, function(){ toggleContent(url, true); }); } else { toggleContent(url, true); } } function toggleContent(url, bool) { if( bool ) { /* load and show new content */ var foldingContent = foldingPanel.find('.cd-fold-content'); foldingContent.load(url+' .cd-fold-content > *', function(event){ setTimeout(function(){ $('body').addClass('overflow-hidden'); foldingPanel.addClass('is-open'); mainContent.addClass('fold-is-open'); }, 100); }); } else { /* close the folding panel */ var mq = viewportSize(); foldingPanel.removeClass('is-open'); mainContent.removeClass('fold-is-open'); (mq == 'mobile' || $('.no-csstransitions').length > 0 ) /* according to the mq, immediately remove the .overflow-hidden or wait for the end of the animation */ ? $('body').removeClass('overflow-hidden') : mainContent.find('.cd-item').eq(0).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function(){ $('body').removeClass('overflow-hidden'); mainContent.find('.cd-item').eq(0).off('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend'); }); } } function viewportSize() { /* retrieve the content value of .cd-main::before to check the actua mq */ return window.getComputedStyle(document.querySelector('.cd-main'), '::before').getPropertyValue('content').replace(/"/g, "").replace(/'/g, ""); } }); весь js код |
на codyhouse вроде бы был ответ( не уверен что точно мой случай)
" I've been having similar issues, try loading a js file underneath line 41 using $.getScript("jsfolder/yourfile.js", function() {}); " но не знаю как его применить |
Часовой пояс GMT +3, время: 07:57. |