I can't find how to change the default zoom level of elevateZoom, any suggestions? This is my code:

$('.img-zoom').elevateZoom({
    responsive: true,
    zoomWindowWidth:500,
    zoomWindowHeight:300,
    zoomWindowFadeIn: 500,
    zoomWindowFadeOut: 750,
    scrollZoom : true
  });

I can't find how to change the default zoom level of elevateZoom, any suggestions? This is my code:

$('.img-zoom').elevateZoom({
    responsive: true,
    zoomWindowWidth:500,
    zoomWindowHeight:300,
    zoomWindowFadeIn: 500,
    zoomWindowFadeOut: 750,
    scrollZoom : true
  });

• javascript
• jquery
• zooming
• elevatezoom

Share Improve this question Follow asked Apr 18, 2017 at 16:06 BoBBoB 13311 silver badge1111 bronze badges 1

• By default elevateZoom sets the zoom to 1, to change it just use the property: zoomLevel: n – BoB Commented Apr 19, 2017 at 9:15

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

For some reason the zoomLevel example is hidden on elevateZoom's example page, but if you use dev tools you can remove the display: none and find the following info:

Zoom Level
The zoomlevel by default is 1, but this can be overridden
You can do this with the zoomLevel config option
Zoom Level 2 would make the image twice as small
Zoom Level 0.5 would make the image twice as big

$("#zoom_11").elevateZoom({
  zoomLevel: 2
});

for those who don't know why "zoomLevel" is not working. you should also set "scrollZoom" to "true".

$(".img-zoom").elevateZoom({
  scrollZoom: true,
  zoomLevel: 0.8
});

For those who are still trying to make ElevateZoom work, it won't work, it's dead project. Use this fork instead: https://igorlino.github.io/elevatezoom-plus/index.html