javascript - Elevate Zoom Reinitialize issue on Window Resize -


i trying implement elevate zoom , got slight problem when window resize. working perfect on screen loaded. when window resize take height , width of image remain same when loaded.

html code

<div class="flexembed" style="width:90%;position: relative;text-align: center;">      <img id="zoom_product" class="zoom_img" src="uploads/products/img001.jpg" style="position: relative;left: 0;top: 0;right: 0;bottom: 0;margin: auto;max-width: 100%;max-height: 100%;" data-zoom-image="uploads/products/img001.jpg"/> </div> 

jquery code

$(window).on('resize', function(){  var imgsrc = $('#zoom_product').attr('src');  var imgzoom = $('#zoom_product').data('zoom-image');  var zoomimage = $('#zoom_product');    $('.zoomcontainer').remove();    zoomimage.removedata('elevatezoom');   zoomimage.attr('src', imgsrc);   zoomimage.data('zoom-image', imgzoom);       zoomimage.elevatezoom({   zoomtype: "inner",   cursor: "crosshair"   });  }   $(document).ready(function(){    $('#zoom_product').elevatezoom({       zoomtype: "inner",       cursor: "crosshair"    }); }); 


Comments

Post a Comment

Popular posts from this blog

cookies - Yii2 Advanced - Share session between frontend and mainsite (duplicate of frontend for www) -

angular - password and confirm password field validation angular2 reactive forms -

javascript - Angular2 intelliJ config error.. Cannot find module '@angular/core' -