jQuery
【jQuery】タッチ、クリック、マウスオーバーで画像を拡大するjQuery Zoom
June 6, 2017

jQuery Zoomはタッチ、クリック、またはマウスオーバーで画像を拡大するjQueryプラグイン。
要素内のHTMLを追加
// Example: $(document).ready(function(){ $('a.photo').zoom({url: 'photo-big.jpg'}); }); // Using Colorbox with Zoom $(document).ready(function(){ $('a.photo').zoom({ url: 'photo-big.jpg', callback: function(){ $(this).colorbox({href: this.src}); } }); });
img
要素でズームを使用
$(document).ready(function(){ $('img') .wrap('<span style="display:inline-block"></span>') .css('display', 'block') .parent() .zoom(); });
$('#example').zoom(); // add zoom $('#example').trigger('zoom.destroy'); // remove zoom
Chrome、Firefox、Safari、Opera、Internet Explorer 7以降のjQuery 1.7以降
MIT