JS获取图片实际宽高,以及根据图片大小进行自适应 
<img src="http://xxx.jpg" id="imgs" onload="adapt();"/> 
function adapt(){ 
var tableWidth = $("#imgTable").width(); //表格宽度 
var img = new Image(); 
img.src =$('#imgs').attr("src") ; 
var imgWidth = img.width; //图片实际宽度 
if(imgWidth<tableWidth){ 
$('#imgs').attr("style","width: auto"); 
}else{ 
$('#imgs').attr("style","width: 100%"); 

另可设置CSS样式: 
<style type="text/css"> 
<!-- 
img{ 
max-width:100%;height:auto; 

--> 
</style> 

JS获取图片实际宽高及根据图片大小进行自适应的更多相关文章

  1. 前端 JS 获取 Image 图像 宽高 尺寸

    前端 JS 获取 Image 图像 宽高 尺寸 简介 项目中用到获取图片的原始尺寸,然后适配宽高:网上的大部分前端解决方案,都是new Image()后,在onload事件中获取image的尺寸. 在 ...

  2. js获取隐藏元素宽高的方法

    网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...

  3. JS获取元素的宽高以及offsetTop,offsetLeft等的属性值

    基本介绍 $(obj).width()与$(obj).height() $(obj).width()与$(obj).height() :jquery方式获取元素的宽高,不包括滚动条与工具条 $(obj ...

  4. JS基础篇--JS获取元素的宽高以及offsetTop,offsetLeft等的属性值

    $(obj).width()与$(obj).height() $(obj).width()与$(obj).height() :jquery方式获取元素的宽高,不包括滚动条与工具条 $(obj).wid ...

  5. JS 获取网页的宽高

    网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWi ...

  6. JS获取当前屏幕宽高

    Javascript: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.b ...

  7. js获取浏览器内容宽高(小计)

    <SCRIPT LANGUAGE="JavaScript">var  s = "";s += "\r\n网页可见区域宽:"+ d ...

  8. 原生js获取屏幕的宽高

    function client(){ if(window.innerHeight !== undefined){ return { "width": window.innerWid ...

  9. 根据图片url地址获取图片的宽高

    /** * 根据img获取图片的宽高 * @param img 图片地址 * @return 图片的对象,对象中图片的真实宽高 */ public BufferedImage getBufferedI ...

随机推荐

  1. IOS 沙盒机制 && 关于document\library\tmp的灵活使用

    默认情况下,每个沙盒含有3个文件夹:Documents, Library 和 tmp.因为应用的沙盒机制,应用只能在几个目录下读写文件Documents:苹果建议将程序中建立的或在程序中浏览到的文件数 ...

  2. 通过GCD、NSOperationQueue队列、NSThread三种方法来创建多线程

    #import "ViewController.h" @interface ViewController () @property (weak, nonatomic) IBOutl ...

  3. 2.1.4 扫描器X-Scan查本机隐患

    X-Scan是由安全焦点开发的一个功能强大的扫描工具.它采用多线程方式对指定IP地址段(或单机)进行安全漏洞检测,支持插件功能. 1.用X-Scan查看本机IP地址 利用X-Scan扫描器来查看本机的 ...

  4. iOS - UI - UIWebView

    1.UIWebView UIWebView 是 苹果提供的用来展示网页的UI控件.它也是最占内存的控件. iOS8.0 webkit框架. WKWebView,相比UIWebView,节省了1/3~1 ...

  5. linux初学 :简易的shell脚本

    什么是shell Shell本身是一个用C语言编写的程序,它是用户使用Unix/Linux的桥梁,用户的大部分工作都是通过Shell完成的 Shell有两种执行命令的方式: 交互式(Interacti ...

  6. 关于真机调试DDMS中的data文件夹打不开的解决方法

    关于真机调试DDMS中的data文件夹打不开的解决方法 今天在开发的时候需要导出程序中的数据库文件查看数据,数据库文件默认就在/data/data/应用包名/databases/数据库名 这个路径下, ...

  7. 原生js显示分页效果

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. POJ 1182 食物链 (并查集)

    食物链 Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 50601   Accepted: 14786 Description ...

  9. SQL server 2008 建立新用户

    进入Instance下的‘安全性’->登录名, 可以选择SQL server 验证,‘强制实施密码策略’.’状态‘ 为启用. 在使用的数据库下‘安全性’->登录名,选择‘登录名’,输入之前 ...

  10. CSS图片翻转例子

                      dfdfdfdfdf <!DOCTYPE html> <html> <head> <meta charset=" ...