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. 搭建Hadoop集群 (二)

    前面的步骤请看  搭建Hadoop集群 (一) 安装Hadoop 解压安装 登录master, 下载解压hadoop 2.6.2压缩包到/home/hm/文件夹. (也可以从主机拖拽或者psftp压缩 ...

  2. 服务器搭建纪录linux+mysql+nginx+php

    新的项目启动 第一版 首先买了阿里云,选好环境镜像包,一键安装. 第一版php打算不用框架,完全手写,主要的功能点 数据交互和图片传输. 后台搭建好后,使用PHP的Laravel, web端还是选定b ...

  3. 几本不错的开源书(to be continued)

    Linux 1.working-on-gnu-linux GNU/Linux 至今已經相當成熟並足以應付日常生活之使用,凍仁也於 2009 年開始使用它來工作至今,將藉由此書 1 來撰寫較有系統的文章 ...

  4. mssql索引使用情况查询

    可通过查询dm_db_index_usage_stats表取得对应表索引被使用次数. 列名 数据类型 说明 database_id smallint 在其中定义表或视图的数据库的 ID. object ...

  5. 通过focusInEvent和eventFilter两种方法改写控件颜色(自定义控件就是这么来的)

    http://www.cnblogs.com/hicjiajia/archive/2012/05/30/2526768.html http://www.cnblogs.com/hicjiajia/ar ...

  6. 自己模拟实现math.h中的函数

    之前一直都很迷惑pow()函数时怎么实现的,对于整数次的幂我还能很容易做到,但是对于分数次幂就不是那么好做了.需要一些高等数学级数的知识. 我这里实现了求ln(x), pow(double x, do ...

  7. Codeforces 123E Maze(树形DP+期望)

    [题目链接] http://codeforces.com/problemset/problem/123/E [题目大意] 给出一棵,给出从每个点出发的概率和以每个点为终点的概率,求出每次按照dfs序从 ...

  8. HDU 5769 Substring(后缀数组)

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=5769 [题目大意] 在一个串中求出包含字母的子串个数, 只要存在一个字符不相等的子串即可视为不同的 ...

  9. Ubuntu 用 pptp 建立 vpn 服务

    1.下载pptp sudo apt-get install pptpd 2.配置pptp 须要改动配置下面的文件: pptpd.conf文件:配置链接后的主机ip和能够分配的内存范围 vi /etc/ ...

  10. H5 应用程序返回button的js代码设计,设计仿stack

    history.back(); 该代码具有天然的缺陷,二手知道,于H5应用,尤其是模仿移动应用程序时,,这是不够. 在放大期js为了实现类似特征,请轻喷. 不多说,上代码: /** * Created ...