jQuery在页面加载时动态修改图片尺寸的方法

前端技术 2023/09/04 JavaScript

本文实例讲述了jQuery在页面加载时动态修改图片尺寸的方法。分享给大家供大家参考。具体如下：

$(window).bind(\"load\", function() {
  // IMAGE RESIZE
  $(\'#product_cat_list img\').each(function() {
    var maxWidth = 120;
    var maxHeight = 120;
    var ratio = 0;
    var width = $(this).width();
    var height = $(this).height();
    if(width > maxWidth){
      ratio = maxWidth / width;
      $(this).css(\"width\", maxWidth);
      $(this).css(\"height\", height * ratio);
      height = height * ratio;
    }
    var width = $(this).width();
    var height = $(this).height();
    if(height > maxHeight){
      ratio = maxHeight / height;
      $(this).css(\"height\", maxHeight);
      $(this).css(\"width\", width * ratio);
      width = width * ratio;
    }
  });
  //$(\"#contentpage img\").show();
  // IMAGE RESIZE
});

希望本文所述对大家的jQuery程序设计有所帮助。

本文地址：https://www.stayed.cn/item/11415

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案