elevatezoom-plus icon indicating copy to clipboard operation
elevatezoom-plus copied to clipboard

Update docs

Open jmarceli opened this issue 8 years ago • 5 comments

It would be nice to have docs updated.

There are handy options like:

  • zoomLevel - initial zoom
  • minZoomLevel
  • maxZoomLevel

jmarceli avatar Aug 12 '15 11:08 jmarceli

And more. Here is (probably) complete options list (from the source code):

    borderColour: '#888',
    borderSize: 4,
    constrainSize: false,  //in pixels the dimensions you want to constrain on
    constrainType: false,  //width or height
    containLensZoom: false,
    cursor: 'inherit', // user should set to what they want the cursor as, if they have set a click function
    debug: false,
    easing: false,
    easingAmount: 12,
    enabled: true,

    gallery: false,
    galleryActiveClass: 'zoomGalleryActive',
    gallerySelector: false,
    galleryItem: 'a',

    imageCrossfade: false,

    lensBorderColour: '#000',
    lensBorderSize: 1,
    lensColour: 'white', //colour of the lens background
    lensFadeIn: false,
    lensFadeOut: false,
    lensOpacity: 0.4, //opacity of the lens
    lensShape: 'square', //can be 'round'
    lensSize: 200,
    lenszoom: false,

    loadingIcon: false, //http://www.example.com/spinner.gif

    // This change will allow to decide if you want to decrease
    // zoom of one of the dimensions once the other reached it's top value,
    // or keep the aspect ratio, default behaviour still being as always,
    // allow to continue zooming out, so it keeps retrocompatibility.
    mantainZoomAspectRatio: false,
    maxZoomLevel: false,
    minZoomLevel: false,

    onComplete: $.noop,
    onDestroy: $.noop,
    onImageClick: $.noop,
    onImageSwap: $.noop,
    onImageSwapComplete: $.noop,
    onShow: $.noop,
    onZoomedImageLoaded: $.noop,

    preloading: 1, //by default, load all the images, if 0, then only load images after activated (PLACEHOLDER FOR NEXT VERSION)
    respond: [],
    responsive: true,
    scrollZoom: false, //allow zoom on mousewheel, true to activate
    scrollZoomIncrement: 0.1,  //steps of the scrollzoom
    showLens: true,
    tint: false, //enable the tinting
    tintColour: '#333', //default tint color, can be anything, red, #ccc, rgb(0,0,0)
    tintOpacity: 0.4, //opacity of the tint
    touchEnabled: true,


    zoomActivation: 'hover', // Can also be click (PLACEHOLDER FOR NEXT VERSION)
    zoomContainerAppendTo: 'body', //zoom container parent selector
    zoomId: -1, // identifier for the zoom container
    zoomLevel: 1, //default zoom level of image
    zoomTintFadeIn: false,
    zoomTintFadeOut: false,
    zoomType: 'window', //window is default,  also 'lens' available -
    zoomWindowAlwaysShow: false,
    zoomWindowBgColour: '#fff',
    zoomWindowFadeIn: false,
    zoomWindowFadeOut: false,
    zoomWindowHeight: 400,
    zoomWindowOffsetX: 0,
    zoomWindowOffsetY: 0,
    zoomWindowPosition: 1, //Possible values: 1-16, but we can also position with a selector string.
    zoomWindowWidth: 400,
    zoomEnabled: true, //false disables zoomwindow from showing
    zIndex: 999

jmarceli avatar Aug 12 '15 11:08 jmarceli

yes you are right, docs need some love. I'm at the moment very short on time for the next weeks. Will try to improve it. but in-between PR's are also very welcome. :)

igorlino avatar Aug 12 '15 12:08 igorlino

First of all many thanks for this plugin. Tell me how (and where) and will try to find some time for docs update.

jmarceli avatar Aug 12 '15 12:08 jmarceli

Great!, here is the file: https://github.com/igorlino/elevatezoom-plus/blob/master/demo/api.htm You may open&edit the project using WebStorm, it has a nice auto-format function.(shortcut is ctrl-alt-L)

igorlino avatar Aug 12 '15 16:08 igorlino

Thanks that is what I was looking for. I'll try to contribute soon.

jmarceli avatar Aug 12 '15 16:08 jmarceli