Image Viewer

zoom in/out on all images and refresh or reload the page and see the results.


    $("#imageViewerContainer1").verySimpleImageViewer({
        imageSource: curect_file_path,
        frame: ['100%', '100%'],
        maxZoom: '900%',
        zoomFactor: '10%',
        saveZoomPos: false,
        mouse: true,
        keyboard: true,
        toolbar: true
    });

This setting ('saveZoomPos: false') will always return the image to the initial state after refreshing the page.


    $("#imageViewerContainer2").verySimpleImageViewer({
        imageSource: curect_file_path,
        frame: ['100%', '100%'],
        maxZoom: '900%',
        zoomFactor: '10%',
        saveZoomPos: true,
        mouse: true,
        keyboard: true,
        toolbar: true
    });

This setting ('saveZoomPos: true') will always save the last state of the image after refreshing the page (this is also the default).


    $("#imageViewerContainer3").verySimpleImageViewer({
        imageSource: curect_file_path,
        frame: ['100%', '100%'],
        maxZoom: '900%',
        zoomFactor: '10%',
        saveZoomPos: false,
        setZoomPos: [23 ,  3582 ,  2686 ,  -2211 ,  -2075],
        mouse: true,
        keyboard: true,
        toolbar: true
    });

This setting will load the image at the position and zoom level specified in the array variable : 'setZoomPos'.
'setZoomPos' setting array must contain 5 numbers: [zoomLevel, dimensionX, dimensionY, positionX, positionY].
click 'i' key after zooming the image to see this information in the console.