Skip to content

Commit b662f50

Browse files
committed
Added simple fallback for touch events. Fixes jackmoore#37 jackmoore#39
Renamed minified file to jquery.zoom.min.js to match jQuery's convention.
1 parent e7ec63f commit b662f50

7 files changed

Lines changed: 38 additions & 43 deletions

File tree

bower.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "jquery-zoom",
33
"description": "Enlarge images on click or mouseover.",
4-
"version": "1.7.8",
4+
"version": "1.7.9",
55
"dependencies": {
66
"jquery": ">=1.7"
77
},

demo.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
#ex2 img:hover { cursor: url(grab.cur), default; }
3636
#ex2 img:active { cursor: url(grabbed.cur), default; }
3737
</style>
38-
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
38+
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script>
3939
<script src='jquery.zoom.js'></script>
4040
<script>
4141
$(document).ready(function(){

jquery.zoom-min.js

Lines changed: 0 additions & 7 deletions
This file was deleted.

jquery.zoom.js

Lines changed: 24 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
Zoom v1.7.8 - 2013-07-30
2+
Zoom v1.7.9 - 2013-10-16
33
Enlarge images on click or mouseover.
44
(c) 2013 Jack Moore - http://www.jacklmoore.com/zoom
55
license: http://www.opensource.org/licenses/mit-license.php
@@ -10,7 +10,8 @@
1010
callback: false,
1111
target: false,
1212
duration: 120,
13-
on: 'mouseover', // other options: 'grab', 'click', 'toggle'
13+
on: 'mouseover', // other options: grab, click, toggle
14+
touch: true, // enables a touch fallback
1415
onZoomIn: false,
1516
onZoomOut: false
1617
};
@@ -79,6 +80,7 @@
7980
$img = $(img),
8081
mousemove = 'mousemove.zoom',
8182
clicked = false,
83+
touched = false,
8284
$urlElement;
8385

8486
// If a url wasn't specified, look for an image element.
@@ -110,6 +112,7 @@
110112
.fadeTo(settings.duration, 0, $.isFunction(settings.onZoomOut) ? settings.onZoomOut.call(img) : false);
111113
}
112114

115+
// Mouse events
113116
if (settings.on === 'grab') {
114117
$(source)
115118
.on('mousedown.zoom',
@@ -130,17 +133,7 @@
130133
e.preventDefault();
131134
}
132135
}
133-
)
134-
.on('touchstart.zoom', function (e) {
135-
e.preventDefault();
136-
start( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
137-
})
138-
.on('touchmove.zoom', function (e) {
139-
e.preventDefault();
140-
zoom.move( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
141-
})
142-
.on('touchend.zoom', stop);
143-
136+
);
144137
} else if (settings.on === 'click') {
145138
$(source).on('click.zoom',
146139
function (e) {
@@ -150,24 +143,12 @@
150143
} else {
151144
clicked = true;
152145
start(e);
153-
$(document)
154-
.on(mousemove, zoom.move)
155-
.on('touchstart.zoom', function (e) {
156-
// no e.preventDefault() cause it will be impossible to turn off with a click
157-
start( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
158-
})
159-
.on('touchmove.zoom', function (e) {
160-
e.preventDefault();
161-
zoom.move( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
162-
});
146+
$(document).on(mousemove, zoom.move);
163147
$(document).one('click.zoom',
164148
function () {
165149
stop();
166150
clicked = false;
167-
$(document)
168-
.off(mousemove, zoom.move)
169-
.off('touchstart.zoom')
170-
.off('touchmove.zoom');
151+
$(document).off(mousemove, zoom.move);
171152
}
172153
);
173154
return false;
@@ -185,24 +166,34 @@
185166
clicked = !clicked;
186167
}
187168
);
188-
} else {
169+
} else if (settings.on === 'mouseover') {
189170
zoom.init(); // Preemptively call init because IE7 will fire the mousemove handler before the hover handler.
190171

191172
$(source)
192173
.on('mouseenter.zoom', start)
193174
.on('mouseleave.zoom', stop)
194-
.on(mousemove, zoom.move)
175+
.on(mousemove, zoom.move);
176+
}
177+
178+
// Touch fallback
179+
if (settings.touch) {
180+
$(source)
195181
.on('touchstart.zoom', function (e) {
196182
e.preventDefault();
197-
start( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
183+
if (touched) {
184+
touched = false;
185+
stop();
186+
} else {
187+
touched = true;
188+
start( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
189+
}
198190
})
199191
.on('touchmove.zoom', function (e) {
200192
e.preventDefault();
201193
zoom.move( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] );
202-
})
203-
.on('touchend.zoom', stop);
194+
});
204195
}
205-
196+
206197
if ($.isFunction(settings.callback)) {
207198
settings.callback.call(img);
208199
}

jquery.zoom.min.js

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

readme.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ A small jQuery plugin for zooming images on mouseover or mousedown. See the [pro
44

55
## Changelog:
66

7+
### v1.7.9 - 2013/10/16
8+
* Added simple fallback for touch events. Fixes #37 #39
9+
* Renamed minified file to jquery.zoom.min.js to match jQuery's convention.
10+
711
### v1.7.8 - 2013/7/30
812
* Will use data-src attribute if present before checking for the presence of an src attribute.
913

zoom.jquery.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "zoom",
33
"title": "Zoom",
44
"description": "Enlarge images on click or mouseover.",
5-
"version": "1.7.8",
5+
"version": "1.7.9",
66
"dependencies": {
77
"jquery": ">=1.7"
88
},

0 commit comments

Comments
 (0)