Друзья, такая задачка. Есть высплывающее окно fancybox, в котором список ссылок аля галерея, при клике на каждую из них открывается новое всплывающее окно, в котором, в свою очередь, другая галерея, опять же при клике на каждую открывается новое всплывающее окно. FancyBox так устроен, что при открытии нового окна из родительского, родительское закрывается. Задача в том, чтобы при закрытии дочерних окон открывались обратно родительские.
Сделать такое с парой окон, назовём её "родитель-потомок", довольно просто - используем для открытия родительского окна callback afterClose. Например:
(код выдран из длинного листинга, поэтому кое-что там лишнее, не имеющее значения, самое главное я прокомментировал)
$('.fancyboxinfo').each(function(index, item) {
$(item).fancybox({
closeClick: true,
beforeLoad: function() {
window.last = this.element; // по этому имени будем его открывать после закрытия дочернего
}
});
});
$(".fancyboxphotos").each(function(index, item) {
$(item).find('a.fancyboximg').fancybox({
closeBtn: true,
closeClick: true,
afterClose: function() {
setTimeout(function() {
jQuery(window.last).trigger('click')
}, 300); // открываем родительское окно после закрытия
}
});
});
А теперь добавляем третье окно. Я добавил его в начало, пусть оно будет самым первым "родителем". То есть, сперва у нас открыто первое окно fancyboxmain. Кликаем в нём на ссылку, это окно закрывается и открывается fancyboxinfo. В нём также кликаем ссылку, оно закрывается и открывается окно fancyboxphotos. Затем мы закрываем fancyboxphotos, открывается опять fancyboxinfo. Данная цепочка работает (в примере ниже), однако после закрытия fancyboxinfo самое первое окно, конечно же, не открывается:
$('.fancyboxmain').each(function(index, item) {
$(item).fancybox({
closeClick: false
});
});
$('.fancyboxinfo').each(function(index, item) {
$(item).fancybox({
closeClick: true,
beforeLoad: function() {
window.last = this.element;
}
});
});
$(".fancyboxphotos").each(function(index, item) {
$(item).find('a.fancyboximg').fancybox({
closeBtn: true,
closeClick: true,
afterClose: function() {
setTimeout(function() {
jQuery(window.last).trigger('click')
}, 300);
}
});
});
Друзья, подскажите, что можно сделать, чтобы после закрытия fancyboxinfo открывалось fancyboxmain?
Я пробовал добавить afterClose для fancyboxinfo, но получается проблема: при переходе от fancyboxinfo к fancyboxphotos первое закрывается, так устроен FancyBox, и соответственно срабатывает afterClose, перекидывающее нас к окну fancyboxinfo и не дающее открыться окну fancyboxphotos. Получается замкнутый круг - в цепочку больше двух окон поставить не получается. Вод пример такого не работающего кода:
$('.fancyboxmain').each(function(index, item) {
$(item).fancybox({
closeClick: false
beforeLoad: function() {
window.first= this.element;
}
});
});
$('.fancyboxinfo').each(function(index, item) {
$(item).fancybox({
closeClick: true,
beforeLoad: function() {
window.last = this.element;
}
afterClose: function() {
setTimeout(function() {
jQuery(window.first).trigger('click')
}, 300);
}
});
});
$(".fancyboxphotos").each(function(index, item) {
$(item).find('a.fancyboximg').fancybox({
closeBtn : true,
closeClick : true,
afterClose: function() {
setTimeout(function() {
jQuery(window.last).trigger('click')
}, 300);
}
});
});
Как всё-таки можно решить эту проблему? Чтобы начиная с первого окно и доходя до третьего, при закрытии мы снова возвращались к первому?
