0
votes

I have been looking around for days for a zoom function whcih does what i need.

what i have is a page with a4 or a3 images which are displayed at the full size. What i want is for when the user clicks to zoom into that point and then zoom out.

i have tried gzoom, mojomagnify but they come close but dont exactly what i want because they have to set the image size. I have also done ti so that the size of image is set dynamically but still not what i require.

Does any one know of a simple tool which does what i need, full size image on screen click to zoom in and click to zoom out??

4
for solid jQuery plugin: jacklmoore.com/zoomBarlas Apaydin

4 Answers

1
votes
0
votes

use jquery ui and js to zoom what ever you want by a slider:

refreshZoom = function()
{
var epicContainer = $('#epic_container');
storyMap.zoomfactor = $( "#bit-zoom-slider" ).slider( "value" ) / 100;      
epicContainer.css({'-moz-transform': 'scale(' + storyMap.zoomfactor + ',' + storyMap.zoomfactor + ')', 'zoom': storyMap.zoomfactor,'-webkit-transform': 'scale(' + storyMap.zoomfactor + ')'});
var newWidth = storyMap.origWidth * storyMap.zoomfactor ;
var newHeigth = storyMap.origHeight * storyMap.zoomfactor ;
$('#bit-scrollbar-helper').css({ 'width': newWidth  + 'px'});
};

$('#zoom-slider').slider({
        orientation: "horizontal",
        range: "min",
        max: 150,
        min: 25,
        value: 100,
        slide: function(){refreshZoom()},
        change: function(){refreshZoom()}
        });
0
votes

There has a collection of image zoom plugins 10+ Best jQuery Zoom Effect Plugins