как в galleriffic внедрить fancybox [Архив форума]

lara_

25.02.2013, 18:51

Здравствуйте.
На сайте используется галерея galleriffic.
Все как обычно: маленькие иконки и большая картинка. Выбираешь определенную иконку и она отображается, как большая картинка.
Только мне нужно, чтобы при нажатии на большую картинку она открывалась в модальном окне(срабатывал fancybox).
Я прописала адрес ссылки к большой картинке, но эта картинка открывается в новом окне. А мне нужно, чтобы срабатывал fancybox.
Я так понимаю, что между двумя плагинами возникает конфликт.
Если у кого-то есть опыт работы с подобными задачами или есть идеи, как разрешить данный вопрос прошу помочь.
Спасибо за помощь.

Deff

25.02.2013, 19:16

lara_,
Типично пытаются подключать к каждому плагину свою библиотеку jQuery
По идее нужно оставлять лишь одну из них, на месте подключения самой первой библиотеки

lara_

26.02.2013, 11:53

Deff, не совсем Вас поняла.
Я подключила библиотеки jquery-1.7.2.min.js,
gallerific.js,
jquery.fancybox-1.3.4.pack.js.
Я новичок в подобных вопросах, поэтому не могли бы Вы понятнее мне объяснить.
Спасибо.

Deff

26.02.2013, 12:29

Я новичок в подобных вопросах, поэтому не могли бы Вы понятнее мне объяснить.
Ну я не экстрасенс. Дайте ссылку на пробную страницу

lara_

26.02.2013, 12:58

http://www.polinadobryakova.com/gallery-decorative-and-applied-arts.html
При щелчке на большой картинке она должна открываться в модальном окне(сейчас картинка открывается в новом окошке).

Deff

26.02.2013, 13:09

lara_,
1. А где инициализация fancybox ?
2. Пропишите ссылки на большую(помимо тега a) в атрибуте data="Тут ссылка" в мелкой картинке, ибо галлерея вынимает картинку из тега и кладет её в правый слайдер.
Перед инициализацией fancybox нужно выпарсить URL из data и переобуть картинку заново

lara_

26.02.2013, 13:39

1. инициализация fancybox:
$("a[rel=galI]").fancybox({
'transitionIn': 'none',
'transitionOut': 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">' + title + '</span>';}
});
//внизу страницы
2.Прописала ссылки (не уверена, что правильно поняла).

Deff

26.02.2013, 14:15

2.Прописала ссылки (не уверена, что правильно поняла).
Ну прописали там(только те ли ?), - в исходнике, в теге <a, они более длинные и путь другой
gallery/resizer.php?imgfile=painting-ru%2Fb2.jpg&max_width=472&max_height=543

lara_

26.02.2013, 14:57

gallery/resizer.php?imgfile=painting-ru%2Fb2.jpg&max_width=472&max_height=543
-Это ссылка на масштабированную картинку.
Мне нужно, чтобы при нажатии открывалась картинка с реальными размерами.
Или они должны быть одинаковы?

Deff

26.02.2013, 15:10

Мне нужно, чтобы при нажатии открывалась картинка с реальными размерами.
Ну если Вы уверены, что то что нужно, чичас поправлю

Deff

26.02.2013, 15:29

Вот такая суммарная замена инициализации
<script type="text/javascript">
jQuery(document).ready(function($) {

// We only want these styles applied when javascript is enabled
$('div.navigation').css({'width' : '300px', 'float' : 'left'});
$('div.content').css('display', 'block');

$("#thumbs ul.thumbs a.thumb img").mousedown(function(){
objNN='';
});

// Initialize Advanced Galleriffic Gallery
var gallery = $('#thumbs').galleriffic({
delay: 2500,
numThumbs: 8,
preloadAhead: 16,
enableTopPager: false,
enableBottomPager: true,
maxPagesToShow: 5,
imageContainerSel: '#slideshow',
controlsContainerSel: '#controls',
captionContainerSel: '#caption',
loadingContainerSel: '#loading',
renderSSControls: false,
renderNavControls: true,

nextPageLinkText: '',
prevPageLinkText: '',
enableHistory: true,
autoStart: false,
syncTransitions: false,
defaultTransitionDuration: 900

});

//Устанавливаем fancybox на текущую картинку в слайдере
var objNN='';
$("#slideshow a.advance-link img").live('mouseover',function(){

if(objNN!==$(this)[0]){ objNN=$(this)[0];

$(this).parent().fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">' + title + '</span>';}

});

}
});

});
</script>

lara_

26.02.2013, 15:49

Спасибо большое, что потратили свое время и помогли мне.
Сейчас у меня при нажатии на иконку происходит смена большой картинки(увеличивается иконка), а также срабатывает fancybox.
Спасибо большое, т.к. у меня вообще ничего не получилось.
Можно еще спросить: дело в том, что я, наверное, не совсем правильно объяснила, что мне нужно. При щелчке мыши на большой картинке (она расположена справа) должен срабатывать fancybox(модальное окно с отбражением большой картинки).

Deff

26.02.2013, 16:55

При щелчке мыши на большой картинке (она расположена справа) должен срабатывать fancybox(модальное окно с отбражением большой картинки).
;) А ... чёрт
<script type="text/javascript">
jQuery(document).ready(function($) {
// We only want these styles applied when javascript is enabled
$('div.navigation').css({'width' : '300px', 'float' : 'left'});
$('div.content').css('display', 'block');

// Initialize Advanced Galleriffic Gallery
var gallery = $('#thumbs').galleriffic({
delay: 2500,
numThumbs: 8,
preloadAhead: 16,
enableTopPager: false,
enableBottomPager: true,
maxPagesToShow: 5,
imageContainerSel: '#slideshow',
controlsContainerSel: '#controls',
captionContainerSel: '#caption',
loadingContainerSel: '#loading',
renderSSControls: false,
renderNavControls: true,

nextPageLinkText: '',
prevPageLinkText: '',
enableHistory: true,
autoStart: false,
syncTransitions: false,
defaultTransitionDuration: 900

});
//Устанавливаем fancybox на текущую картинку в слайдере
var objNN='';
$("#slideshow a.advance-link img").live('mouseover',function(){

if(objNN!==$(this)[0]){ objNN=$(this)[0];

$(this).parent().fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">' + title + '</span>';}

});

}
});

});

</script>

lara_

26.02.2013, 17:25

Спасибо Вам большое.
Как здорово!!!
Все работает!!
Я так рада.
Спасибо Вам.
Вы мне очень помогли.
Спасибо.

Deff

26.02.2013, 17:53