Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.11.2015, 18:46
Интересующийся
Отправить личное сообщение для blackcky Посмотреть профиль Найти все сообщения от blackcky
 
Регистрация: 24.10.2014
Сообщений: 25

Не работает 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" - она бы не работала вообще.
Ответить с цитированием
  #2 (permalink)  
Старый 06.11.2015, 18:48
Интересующийся
Отправить личное сообщение для blackcky Посмотреть профиль Найти все сообщения от blackcky
 
Регистрация: 24.10.2014
Сообщений: 25

http://belovoloff.esy.es/ - это сайт
Ответить с цитированием
  #3 (permalink)  
Старый 06.11.2015, 18:49
Интересующийся
Отправить личное сообщение для blackcky Посмотреть профиль Найти все сообщения от blackcky
 
Регистрация: 24.10.2014
Сообщений: 25

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 код
Ответить с цитированием
  #4 (permalink)  
Старый 06.11.2015, 18:51
Интересующийся
Отправить личное сообщение для blackcky Посмотреть профиль Найти все сообщения от blackcky
 
Регистрация: 24.10.2014
Сообщений: 25

на codyhouse вроде бы был ответ( не уверен что точно мой случай)
" I've been having similar issues, try loading a js file underneath line 41 using $.getScript("jsfolder/yourfile.js", function() {}); "
но не знаю как его применить
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
innerHTML для TR в InternetExplorer не работает? Непонятливый Элементы интерфейса 3 15.10.2012 17:14
JS: работает на сервере, не работает из папки -majestic- Общие вопросы Javascript 2 02.08.2012 14:41
Не работает push! Динамическая вставка TSEH25 ExtJS 5 03.07.2012 13:00
jQyery функция странно работает! Midel Общие вопросы Javascript 4 08.04.2012 13:40
помогите найти ошибку (работает в IE но не работает в Firefox) Len4ik Javascript под браузер 2 11.05.2010 15:41