function ResizePic() {
        $('img').each(function () {
            var maxWidth = 450; // 图片最大宽度
            var maxHeight = 750;    // 图片最大高度
            var ratio = 0;  // 缩放比例
            var width = $(this).width();    // 图片实际宽度
            var height = $(this).height();  // 图片实际高度

// 检查图片是否超宽
            if (width > maxWidth) {
                //计算缩放比例
                ratio = maxWidth / width;
                $(this).css("width", maxWidth); // 设定实际显示宽度
                height = height * ratio;    // 计算等比例缩放后的高度
                $(this).css("height", height);  // 设定等比例缩放后的高度
            }

// 检查图片是否超高
            if (height > maxHeight) {
                ratio = maxHeight / height;
                $(this).css("height", maxHeight);   // 设定实际显示高度
                width = width * ratio;    // 计算等比例缩放后的高度
                $(this).css("width", width * ratio);    // 设定等比例缩放后的高度
            }
        });

}

Js动态设置Img大小的更多相关文章

  1. js动态设置padding-top遇到的坑

    我想通过js动态设置元素padding-top的百分比值:以下几种都是无法设置成功的: // setAttribute设置padding-top并且转换为百分比 imageBox.setAttribu ...

  2. 【微信小程序】动态设置图片大小

    我们都知道微信小程序的组件image是用来显示图片的,它有一下几个属性:1.src              图片资源地址2.mode          图片裁剪.缩放的模式3.binderror   ...

  3. Dynamic CRM 2013学习笔记(二十八)用JS动态设置字段的change事件、必填、禁用以及可见

    我们知道通过界面设置字段的change事件,是否是必填,是否可见非常容易.但有时我们需要动态地根据某些条件来设置,这时有需要通过js来动态地控制了. 下面分别介绍如何用js来动态设置.   一.动态设 ...

  4. js动态设置窗体位置

    1设置登录框的js,动态设置高度等 <script> $(document).ready(function () { $() / + "px"); $("in ...

  5. js动态设置根元素的rem方案

    方案需求: rem 单位在做移动端的h5开发的时候是最经常使用的单位.为解决自适应的问题,我们需要动态的给文档的根节点添加font-size 值. 使用mediaquery 可以解决这个问题,但是每一 ...

  6. js动态设置输入框字体/颜色

    动态设置文本框颜色: 主要是利用javascript中的触发事件onfocus和onblur <script language="javascript" type=" ...

  7. JS动态设置css的几种方式

    1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保留 - 号,就中括号的形式  element. ...

  8. Js动态设置rem来实现移动端字体的自适应

    //设置根元素字体 var win = window, doc = document; function setFontSize() { var winWidth = $(window).width( ...

  9. js 动态设置键值对数组 ,类似于 java 的Map 类型

    1.前言 我想设置一个数据  var json = {a1 :1  , a2 :2  , a3 :3  .....} 这样的动态数据 ,怎么写呢? 2.正确写法 var json = []; for ...

随机推荐

  1. 常用Java片段

    1. 字符串与整型的相互转换 String a = String.valueOf(2);   //integer to numeric string int i = Integer.parseInt( ...

  2. 原生js倒计时和显示当前时间

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. IronPython初体验和实战集合等类型转换和类型匹配

    人老了,做什么都累~学到了这么多技术,从最早C到C++再到JAVA再到C#,最终都是为了改善产品,改善系统的可维护性.众所周知C#,C++,C都是强类型语言,什么情况都得定义一些实体类来改变业务模型, ...

  4. printf与scanf的返回值、注意点

    printf()的返回值为其输出字符串常量的字符数(注意字符数与字数的区别)注意计数针对所有的打印字符,包括空格和不可见的换行字符(不包括字符串的空字符). scanf()函数返回成功读入的项目的个数 ...

  5. 转:批处理for命令详解

    批处理for命令详解FOR这条命令基本上都被用来处理文本,但还有其他一些好用的功能!看看他的基本格式(这里我引用的是批处理中的格式,直接在命令行只需要一个%号)FOR 参数 %%变量名 IN (相关文 ...

  6. UIWindow 详解

    UIWindow对象是所有UIView的根视图,管理和协调的应用程序的显示.分发事件给View.UIWindow类是UIView的子类,可以看作是特殊的UIView.一般应用程序只有一个UIWindo ...

  7. POJ 3581 Sequence(后缀数组)

    [题目链接] http://poj.org/problem?id=3581 [题目大意] 给出一个数列,将这个数列分成三段,每段分别翻转,使得其字典序最小,输出翻转后的数列. [题解] 首先,第一个翻 ...

  8. iOS搜索指定字符在字符串中的位置

    NSString *tmpStr = @"asd341234aaaaccd"; NSRange range; range = [tmpStr rangeOfString:@&quo ...

  9. php获取apk信息

    使用方法如下: <?php require('apk_parser.php'); $p = new ApkParser(); /* if($argc<2) { echo "usa ...

  10. Linux下多线程查看工具(pstree、ps、pstack)

    转自:http://blog.csdn.net/yfkiss/article/details/6729364 1. pstree pstree以树结构显示进程 $ pstree -p work | g ...