图片放大缩小的简单实现

来源：互联网发布：红米手机清除数据失败编辑：程序博客网时间：2024/04/27 18:24

/** * 图片放大缩小的简单实现 * Depends: jquery.min.js * @author Lin Chenglin * @date 2012-12-04 */(function($) { $.fn.extend( {  zoom : function(options) {   var opts = $.extend( {}, $.fn.zoom.defaults, options);   this.each(function(i, obj) {    _zoom(obj, opts);   });   $(this).click(     function() {      if ($(this).height() > opts.height        || $(this).width() > opts.width) {       _zoom(this, opts);      } else {// 放大到图片的实际尺寸       $(this).css( {        width : '',        height : ''       });      }     })  } }) /**  * 默认配置  */ $.fn.zoom.defaults = {  height : 50,  width : 50 }; /**  * 缩小或放大  */ function _zoom(obj, opts) {  var height = opts.height;  var width = opts.width;  var heightP = height / $(obj).height();  var widthP = width / $(obj).width();  if (heightP >= widthP) {   $(obj).width(width);  } else {   $(obj).height(height);  } }})(jQuery);

0 0