main

/*!

    Zoom 1.7.21

    license: MIT

    http://www.jacklmoore.com/zoom

*/

(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,

            $target = $(target),

            position = $target.css('position'),

            $source = $(source);

​

        // The parent element needs positioning so that the zoomed element can be correctly positioned within.

        target.style.position = /(absolute|fixed)/.test(position) ? position : 'relative';

        target.style.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',

                maxHeight: '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 && $(settings.target)[0] || this,

            //source will provide zoom location info (thumbnail)

            source = this,

            $source = $(source),

            img = document.createElement('img'),