Skip to content

Commit

Permalink
Fixed fancyapps#1432 - Clicking scrollbar causes fancybox to close
Browse files Browse the repository at this point in the history
  • Loading branch information
@fancyapps
fancyapps committed May 12, 2017
1 parent cf63235 commit f5ec4c9
Show file tree
Hide file tree
Showing 5 changed files with 44 additions and 40 deletions.
40 changes: 21 additions & 19 deletions dist/jquery.fancybox.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// ==================================================
// fancyBox v3.1.7
// fancyBox v3.1.8
//
// Licensed GPLv3 for open source use
// or fancyBox Commercial License for commercial use
Expand Down Expand Up @@ -1416,7 +1416,7 @@
// - click action is "zoom"
// - actual size of the image is smaller than available area
if ( current.type === 'image' && current.isLoaded && !current.hasError &&
( current.opts.clickContent === 'zoom' || current.opts.clickContent( current ) === "zoom" )
( current.opts.clickContent === 'zoom' || ( $.isFunction( current.opts.clickContent ) && current.opts.clickContent( current ) === "zoom" ) )
) {

fitPos = self.getFitPos( current );
Expand Down Expand Up @@ -2632,7 +2632,7 @@

$.fancybox = {

version : "3.1.7",
version : "3.1.8",
defaults : defaults,


Expand Down Expand Up @@ -3410,20 +3410,20 @@
self.instance = instance;

self.$bg = instance.$refs.bg;
self.$stage = instance.$refs.stage;
self.$stage = instance.$refs.stage;
self.$container = instance.$refs.container;

self.destroy();

self.$stage.on('touchstart.fb.touch mousedown.fb.touch', $.proxy(self, "ontouchstart"));
self.$stage.on( 'touchstart.fb.touch mousedown.fb.touch', $.proxy(self, 'ontouchstart') );

self.$container.on('touchstart.fb.touch mousedown.fb.touch', $.proxy(self, "ontap"));
self.$container.on( 'touchstart.fb.touch mousedown.fb.touch', $.proxy(self, 'ontap') );

};

Guestures.prototype.destroy = function() {

this.$stage.add( this.$container ).off('.fb.touch');
this.$stage.add( this.$container ).off( '.fb.touch' );

};

Expand Down Expand Up @@ -3453,25 +3453,25 @@
}

// Skip if clicked on the scrollbar
if ( $target.is('.fancybox-slide') && e.originalEvent.clientX > self.canvasWidth + current.$slide.offset().left ) {
return true;
if ( e.originalEvent.clientX > $target[0].clientWidth + $target.offset().left ) {
return;
}

// Ignore taping on links, buttons and scrollable items
// Ignore taping on links, buttons, input elements
if ( isClickable( $target ) || isClickable( $target.parent() ) ) {
return;
}

// Skip on scrollable items on mobile, otherwise it would not be possible to scroll
if ( $.fancybox.isMobile && ( isScrollable( $target ) || isScrollable( $target.parent() ) ) ) {
if ( $.fancybox.isMobile && ( isScrollable( $target ) || isScrollable( $target.parent() ) ) ) {
e.stopPropagation();

return;
}

// If "touch" is disabled, then handle click event only
if ( !current.opts.touch ) {
return;// self.ontap( e );
return;
}

e.stopPropagation();
Expand Down Expand Up @@ -3524,8 +3524,6 @@

} else {



self.isSwiping = true;
}

Expand Down Expand Up @@ -3618,7 +3616,6 @@
// Reset points to avoid jumping, because we dropped first swipes to calculate the angle
self.startPoints = self.newPoints;


$.each(self.instance.slides, function( index, slide ) {
$.fancybox.stop( slide.$slide );

Expand Down Expand Up @@ -4026,13 +4023,13 @@
};

Guestures.prototype.ontap = function(e) {

var self = this;
var self = this;
var $target = $( e.target );

var instance = self.instance;
var current = instance.current;

var endPoints = self.startPoints || pointers( e );
var endPoints = ( e && pointers( e ) ) || self.startPoints;

var tapX = endPoints[0] ? endPoints[0].x - self.$stage.offset().left : 0;
var tapY = endPoints[0] ? endPoints[0].y - self.$stage.offset().top : 0;
Expand Down Expand Up @@ -4112,8 +4109,13 @@
return;
}

// Skip if clicked on the scrollbar
if ( tapX > $target[0].clientWidth + $target.offset().left ) {
return;
}

// Check where is clicked
if ( $( e.target ).is('.fancybox-slide,.fancybox-bg,.fancybox-container') ) {
if ( $target.is('.fancybox-slide,.fancybox-bg,.fancybox-container') ) {
where = 'Outside';

} else if ( instance.current.$content && instance.current.$content.has( e.target ).length ) {
Expand Down
6 changes: 3 additions & 3 deletions dist/jquery.fancybox.min.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "@fancyapps/fancybox",
"description": "Touch enabled, responsive and fully customizable jQuery lightbox script",
"version": "3.1.7",
"version": "3.1.8",
"homepage": "http://fancyapps.com/fancybox/",
"main": "./dist/jquery.fancybox.min.js",
"author": "fancyApps",
Expand Down
2 changes: 1 addition & 1 deletion src/js/core.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1406,7 +1406,7 @@
// - click action is "zoom"
// - actual size of the image is smaller than available area
if ( current.type === 'image' && current.isLoaded && !current.hasError &&
( current.opts.clickContent === 'zoom' || current.opts.clickContent( current ) === "zoom" )
( current.opts.clickContent === 'zoom' || ( $.isFunction( current.opts.clickContent ) && current.opts.clickContent( current ) === "zoom" ) )
) {

fitPos = self.getFitPos( current );
Expand Down
34 changes: 18 additions & 16 deletions src/js/guestures.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -121,20 +121,20 @@
self.instance = instance;

self.$bg = instance.$refs.bg;
self.$stage = instance.$refs.stage;
self.$stage = instance.$refs.stage;
self.$container = instance.$refs.container;

self.destroy();

self.$stage.on('touchstart.fb.touch mousedown.fb.touch', $.proxy(self, "ontouchstart"));
self.$stage.on( 'touchstart.fb.touch mousedown.fb.touch', $.proxy(self, 'ontouchstart') );

self.$container.on('touchstart.fb.touch mousedown.fb.touch', $.proxy(self, "ontap"));
self.$container.on( 'touchstart.fb.touch mousedown.fb.touch', $.proxy(self, 'ontap') );

};

Guestures.prototype.destroy = function() {

this.$stage.add( this.$container ).off('.fb.touch');
this.$stage.add( this.$container ).off( '.fb.touch' );

};

Expand Down Expand Up @@ -164,25 +164,25 @@
}

// Skip if clicked on the scrollbar
if ( $target.is('.fancybox-slide') && e.originalEvent.clientX > self.canvasWidth + current.$slide.offset().left ) {
return true;
if ( e.originalEvent.clientX > $target[0].clientWidth + $target.offset().left ) {
return;
}

// Ignore taping on links, buttons and scrollable items
// Ignore taping on links, buttons, input elements
if ( isClickable( $target ) || isClickable( $target.parent() ) ) {
return;
}

// Skip on scrollable items on mobile, otherwise it would not be possible to scroll
if ( $.fancybox.isMobile && ( isScrollable( $target ) || isScrollable( $target.parent() ) ) ) {
if ( $.fancybox.isMobile && ( isScrollable( $target ) || isScrollable( $target.parent() ) ) ) {
e.stopPropagation();

return;
}

// If "touch" is disabled, then handle click event only
if ( !current.opts.touch ) {
return;// self.ontap( e );
return;
}

e.stopPropagation();
Expand Down Expand Up @@ -235,8 +235,6 @@

} else {



self.isSwiping = true;
}

Expand Down Expand Up @@ -329,7 +327,6 @@
// Reset points to avoid jumping, because we dropped first swipes to calculate the angle
self.startPoints = self.newPoints;


$.each(self.instance.slides, function( index, slide ) {
$.fancybox.stop( slide.$slide );

Expand Down Expand Up @@ -737,13 +734,13 @@
};

Guestures.prototype.ontap = function(e) {

var self = this;
var self = this;
var $target = $( e.target );

var instance = self.instance;
var current = instance.current;

var endPoints = self.startPoints || pointers( e );
var endPoints = ( e && pointers( e ) ) || self.startPoints;

var tapX = endPoints[0] ? endPoints[0].x - self.$stage.offset().left : 0;
var tapY = endPoints[0] ? endPoints[0].y - self.$stage.offset().top : 0;
Expand Down Expand Up @@ -823,8 +820,13 @@
return;
}

// Skip if clicked on the scrollbar
if ( tapX > $target[0].clientWidth + $target.offset().left ) {
return;
}

// Check where is clicked
if ( $( e.target ).is('.fancybox-slide,.fancybox-bg,.fancybox-container') ) {
if ( $target.is('.fancybox-slide,.fancybox-bg,.fancybox-container') ) {
where = 'Outside';

} else if ( instance.current.$content && instance.current.$content.has( e.target ).length ) {
Expand Down

0 comments on commit f5ec4c9

Please sign in to comment.