PHP Classes

File: assets/plugins/zoom/jquery.zoom.js

Recommend this page to a friend!
  Classes of Nemeth Zoltan   YAF Base   assets/plugins/zoom/jquery.zoom.js   Download  
File: assets/plugins/zoom/jquery.zoom.js
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: YAF Base
Base structure for YAF framework based apps
Author: By
Last change:
Date: 6 years ago
Size: 5,573 bytes
 

Contents

Class file image Download
/*! Zoom v1.7.11 - 2013-11-12 Enlarge images on click or mouseover. (c) 2013 Jack Moore - http://www.jacklmoore.com/zoom license: http://www.opensource.org/licenses/mit-license.php */ (function ($) { var defaults = { url: false, callback: false, target: false, duration: 120, on: 'mouseover', // other options: grab, click, toggle touch: true, // enables a touch fallback onZoomIn: false, onZoomOut: false, magnify: 1 }; // Core Zoom Logic, independent of event listeners. $.zoom = function(target, source, img, magnify) { var targetHeight, targetWidth, sourceHeight, sourceWidth, xRatio, yRatio, offset, position = $(target).css('position'); // The parent element needs positioning so that the zoomed element can be correctly positioned within. $(target).css({ position: /(absolute|fixed)/.test(position) ? position : 'relative', overflow: 'hidden' }); img.style.width = img.style.height = ''; $(img) .addClass('zoomImg') .css({ position: 'absolute', top: 0, left: 0, opacity: 0, width: img.width * magnify, height: img.height * magnify, border: 'none', maxWidth: 'none' }) .appendTo(target); return { init: function() { targetWidth = $(target).outerWidth(); targetHeight = $(target).outerHeight(); if (source === target) { sourceWidth = targetWidth; sourceHeight = targetHeight; } else { sourceWidth = $(source).outerWidth(); sourceHeight = $(source).outerHeight(); } xRatio = (img.width - targetWidth) / sourceWidth; yRatio = (img.height - targetHeight) / sourceHeight; offset = $(source).offset(); }, move: function (e) { var left = (e.pageX - offset.left), top = (e.pageY - offset.top); top = Math.max(Math.min(top, sourceHeight), 0); left = Math.max(Math.min(left, sourceWidth), 0); img.style.left = (left * -xRatio) + 'px'; img.style.top = (top * -yRatio) + 'px'; } }; }; $.fn.zoom = function (options) { return this.each(function () { var settings = $.extend({}, defaults, options || {}), //target will display the zoomed image target = settings.target || this, //source will provide zoom location info (thumbnail) source = this, img = document.createElement('img'), $img = $(img), mousemove = 'mousemove.zoom', clicked = false, touched = false, $urlElement; // If a url wasn't specified, look for an image element. if (!settings.url) { $urlElement = $(source).find('img'); if ($urlElement[0]) { settings.url = $urlElement.data('src') || $urlElement.attr('src'); } if (!settings.url) { return; } } img.onload = function () { var zoom = $.zoom(target, source, img, settings.magnify); function start(e) { zoom.init(); zoom.move(e); // Skip the fade-in for IE8 and lower since it chokes on fading-in // and changing position based on mousemovement at the same time. $img.stop() .fadeTo($.support.opacity ? settings.duration : 0, 1, $.isFunction(settings.onZoomIn) ? settings.onZoomIn.call(img) : false); } function stop() { $img.stop() .fadeTo(settings.duration, 0, $.isFunction(settings.onZoomOut) ? settings.onZoomOut.call(img) : false); } // Mouse events if (settings.on === 'grab') { $(source) .on('mousedown.zoom', function (e) { if (e.which === 1) { $(document).one('mouseup.zoom', function () { stop(); $(document).off(mousemove, zoom.move); } ); start(e); $(document).on(mousemove, zoom.move); e.preventDefault(); } } ); } else if (settings.on === 'click') { $(source).on('click.zoom', function (e) { if (clicked) { // bubble the event up to the document to trigger the unbind. return; } else { clicked = true; start(e); $(document).on(mousemove, zoom.move); $(document).one('click.zoom', function () { stop(); clicked = false; $(document).off(mousemove, zoom.move); } ); return false; } } ); } else if (settings.on === 'toggle') { $(source).on('click.zoom', function (e) { if (clicked) { stop(); } else { start(e); } clicked = !clicked; } ); } else if (settings.on === 'mouseover') { zoom.init(); // Preemptively call init because IE7 will fire the mousemove handler before the hover handler. $(source) .on('mouseenter.zoom', start) .on('mouseleave.zoom', stop) .on(mousemove, zoom.move); } // Touch fallback if (settings.touch) { $(source) .on('touchstart.zoom', function (e) { e.preventDefault(); if (touched) { touched = false; stop(); } else { touched = true; start( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] ); } }) .on('touchmove.zoom', function (e) { e.preventDefault(); zoom.move( e.originalEvent.touches[0] || e.originalEvent.changedTouches[0] ); }); } if ($.isFunction(settings.callback)) { settings.callback.call(img); } }; img.src = settings.url; $(source).one('zoom.destroy', function(){ $(source).off(".zoom"); $img.remove(); }); }); }; $.fn.zoom.defaults = defaults; }(window.jQuery));