zoukankan      html  css  js  c++  java
  • 限制图片显示宽度和高度

    有时在展现图片时,由于图片尺寸不固定,会造成页面会产生错位,所以对图片设定一个尺寸范围

    超出范围的图片,自动缩放

    方法一、CSS方法

    .div_pic img { expression(this.width > 550 ? 550: true); max- 550px;}

    方法二、jQuery方法

    Download jQuery 1.2.6 (15kb, Minified and Gzipped)

    /* 自动缩略一些大图的小JS
        吕 lvjiyong@Gmail.com
        http://www.lvjiyong.com/tag/jquery/
        更新:2007.9.22

    更新2007.9.28

    */
    jquery.fn.ImageAutoSize = function(width,height)
    {
        $("img",this).each(function()
        {
            var image = $(this);
            if(image.width()>width)
            {
                image.width(width);
                image.height(width/image.width()*image.height());
            }
            if(image.height()>height)
            {
                image.height(height);
                image.width(height/image.height()*image.width());
            }
        });
    }

    调用:先引用上面的脚本或将上页的脚本放入自己的JS库,然后只要再加

    $(function(){ $("图片组所在的容器").ImageAutoSize(限制最大宽,限制最大高);});

  • 相关阅读:
    go入门4---数据
    hibernate之关联关系一对多
    hibernate的主键生成策略
    hibernate的入门
    struts--CRUD优化(图片上传)
    struts2--CRUD
    struts2--入
    Maven环境搭建
    EasyUI--增删改查
    easyui--权限管理
  • 原文地址:https://www.cnblogs.com/5tao/p/1331861.html
Copyright © 2011-2022 走看看