Skip to content

Instantly share code, notes, and snippets.

@Dimls
Created March 5, 2018 11:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Dimls/977ea5ecd196e02385d3ed7235808e0e to your computer and use it in GitHub Desktop.
Save Dimls/977ea5ecd196e02385d3ed7235808e0e to your computer and use it in GitHub Desktop.
imageZoom: {
init: function(){
Reqs.pannZoom();
$('.product-image-img').on('click', function(){
var image_url = $(this).closest('.product-image').attr('data-bg-src') || $(this).closest('.product-image').attr('data-image');
imageZoom.image(image_url);
});
},
image: function(url){
var modal = $('.mobile-zoom-overlay'),
modal_img = new Image();
modal_img.src = url;
modal.append(modal_img);
$(modal_img).load(function(){
var $img = $(this),
img_height = $img.height(),
img_position = (($(window).innerHeight() - img_height)/2);
$img.css('top', img_position);
modal.addClass('is-visible');
$img.addClass('fade-in');
$img.panzoom();
// var data = 'window: '+$(window).height()+', img: '+img_height+', pos: '+img_position;
// alert(data);
});
$('.js-MobileZoom-close').on('click', function(){
imageZoom.hide(modal);
});
},
hide: function(modal){
modal.addClass('is-hiding');
setTimeout(function(){
modal.removeClass('is-hiding is-visible');
modal.find('img').panzoom('destroy').remove(); // kill zoom and remove <img>
}, 300);
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment