Есть OwlCarousel с фотографиями, при нажатии на которые по двойному клику должна
открываться галерея fancybox.
Дело в том, что галерея открывается по умолчанию по одинарному клику.
А иногда даже просто при попытке сделать свайп карусели открывается модальное окно,
а этого не должно быть.
Хочу запретить открывать фансибокс по одинарному клику, и слушать двойной.
Могу отменить первый клик, двойной происходит, но фансибокс не определяется..:
function init() {
initFancybox();
initGallerySlider();
}
window.onload = init;
function initGallerySlider() {
$('.gallery').owlCarousel({
loop: true,
margin: 0,
autoWidth: true
});
}
function initFancybox() {
$(document).on('fancybox.init', '.fancybox', function() {
var
defaults = {
maxWidth: 994,
autoResize: true,
padding: 0,
helpers: {
media: {},
overlay: {}
}
},
$el = $(this),
group = $el.attr('data-fancybox-group'),
options = eval('[' + $el.data('fancybox-options') + ']')[0];
if (group) $el = $('[data-fancybox-group="' + group + '"]');
$.extend(defaults, options);
$el.fancybox(defaults);
});
$('.fancybox').trigger('fancybox.init');
}
$('[data-fancybox="gallery"]').click(function(e) {
e.preventDefault();
});
$('[data-fancybox="gallery"]').dblclick(function() {
$(this).fancybox();
});
.gallery__item {
display: block;
height: 200px;
width: 200px;
background-size: cover;
}
Подскажите плз, как после отправки формы открыть окно с блоком
на
5-10 секунд и пропадало, планирую сделать на fancybox
Планирую использовать:
$('#send').submit(function(e) {
$.fancybox({
href: '#thx',
modal: true
});
return false;
});
Но открытие так и не происходит....
Есть OwlCarousel с фотографиями, при нажатии на которые по двойному клику должна открываться галерея fancybox
Дело в том, что галерея открывается по умолчанию по одинарному клику.
А иногда даже просто при попытке сделать свайп карусели открывается модальное окно, а этого не должно быть.
Хочу запретить открывать фансибокс по одинарному клику, и слушать двойной.
Могу отменить первый клик, двойной происходит, но фансибокс не определяется..:
function init() {
initFancybox();
initGallerySlider();
}
window.onload = init;
function initGallerySlider() {
$('.gallery').owlCarousel({
loop: true,
margin: 0,
autoWidth: true
});
}
function initFancybox() {
$(document).on('fancybox.init', '.fancybox', function() {
var
defaults = {
maxWidth: 994,
autoResize: true,
padding: 0,
helpers: {
media: {},
overlay: {}
}
},
$el = $(this),
group = $el.attr('data-fancybox-group'),
options = eval('[' + $el.data('fancybox-options') + ']')[0];
if (group) $el = $('[data-fancybox-group="' + group + '"]');
$.extend(defaults, options);
$el.fancybox(defaults);
});
$('.fancybox').trigger('fancybox.init');
}
$('[data-fancybox="gallery"]').click(function(e) {
e.preventDefault();
});
$('[data-fancybox="gallery"]').dblclick(function() {
$(this).fancybox();
});
.gallery__item {
display: block;
height: 200px;
width: 200px;
background-size: cover;
}
Подскажите плз, как после отправки формы открыть окно с блоком
на 5-10 секунд и пропадало, планирую сделать на fancybox Планирую использовать:
$('#send').submit(function(e) {
$.fancybox({
href: '#thx',
modal: true
});
return false;
});
Но открытие так и не происходит....
Ответ
Решил сам:
в конце php функции добавил код sleep(5); а скрипт такой:
$('.send').click(function() {
$.ajax({
type: $(this).attr('method'),
url: $(this).attr('action'),
data: $(this).serialize('#contact'),
success: function(data) {
$.fancybox({
href: '#thx',
openEffect: 'elastic',
closeEffect: 'elastic',
afterLoad: function() {
setTimeout(function() {
parent.$.fancybox.close({
closeEffect: 'elastic'
});
}, 3000);
}
});
}
});
});
может кому пригодится....
Мне же нужно, чтобы работало так:
