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%");
}
}
<style type="text/css">
<!--
img{
max-width:100%;height:auto;
}
-->
</style>
JS获取图片实际宽高及根据图片大小进行自适应的更多相关文章
- 前端 JS 获取 Image 图像 宽高 尺寸
前端 JS 获取 Image 图像 宽高 尺寸 简介 项目中用到获取图片的原始尺寸,然后适配宽高:网上的大部分前端解决方案,都是new Image()后,在onload事件中获取image的尺寸. 在 ...
- js获取隐藏元素宽高的方法
网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...
- JS获取元素的宽高以及offsetTop,offsetLeft等的属性值
基本介绍 $(obj).width()与$(obj).height() $(obj).width()与$(obj).height() :jquery方式获取元素的宽高,不包括滚动条与工具条 $(obj ...
- JS基础篇--JS获取元素的宽高以及offsetTop,offsetLeft等的属性值
$(obj).width()与$(obj).height() $(obj).width()与$(obj).height() :jquery方式获取元素的宽高,不包括滚动条与工具条 $(obj).wid ...
- JS 获取网页的宽高
网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWi ...
- JS获取当前屏幕宽高
Javascript: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.b ...
- js获取浏览器内容宽高(小计)
<SCRIPT LANGUAGE="JavaScript">var s = "";s += "\r\n网页可见区域宽:"+ d ...
- 原生js获取屏幕的宽高
function client(){ if(window.innerHeight !== undefined){ return { "width": window.innerWid ...
- 根据图片url地址获取图片的宽高
/** * 根据img获取图片的宽高 * @param img 图片地址 * @return 图片的对象,对象中图片的真实宽高 */ public BufferedImage getBufferedI ...
随机推荐
- Asynctask的使用及理解
1.对于耗时的操作,我们的一般方法是开启“子线程”.如果需要更新UI,则需要使用handler 2.如果耗时的操作太多,那么我们需要开启太多的子线程,这就会给系统带来巨大的负担,随之也会带来性能方面的 ...
- ava SE ---逻辑运算符
java中有4个逻辑运算符:&与,&& 逻辑与,| 或,|| 逻辑或这些运算符要求操作数和结果值都是布尔型. a&&b a||b 1) 逻辑与& ...
- 使用 mina 传输大字节数组
转载自:http://seara520.blog.163.com/blog/static/16812769820103214817781/ 使用mina传输超过2k以上的数据时(采用tcp方式,如果是 ...
- 重构23-Introduce Parameter Object(参数对象)
有 时当 使用 一个 包含 多 个 参 数 的 方 法 时 , 由 于参 数 过 多 会 导 致 可 读 性 严 重 下 降 , 如 : 有 时当 使用 一个 包含 多 个 参 数 的 方 法 时 , ...
- Freebsd 编译内核
# cd /usr/src/sys/i386/conf # cp GENERIC GENERIC.20060812# ee GENERIC 如果要加入ipf防火墙的话则加入options ...
- orcale 列改为大字段
--添加临时列ALTER TABLE MPD_TASK_LIST ADD( CLOB_TEMP clob);--数据拷贝到临时列update MPD_TASK_LIST set CLOB_TEMP ...
- 重磅消息:JavaFX官方文档翻译完毕
经过XMan团队业余时间半年的努力,终于将JavaFX官方文档全部翻译完毕,内容已经全部在http://www.javafxchina.net中发表. 中文文档具体目录如下: 第一篇 开始学习Java ...
- WPF 之 数据绑定
数据绑定需要: 后台必须要有与控件对应的类和相关的属性 在后台new 一个类的对象 在后台把控件的数据上下文设置为该对象. 在XAML中把要绑定的控件中Text = "{Bindi ...
- DIV+CSS解决IE6,IE7,IE8,FF兼容问题
1.IE8下兼容问题,这个最好处理,转化成IE7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了:1. <metahttp-equivmetahttp-equiv ...
- 五.CSS盒子模型
所谓盒模型,就是浏览器为每个HTML元素生成的矩形盒子.即HTML页面实际上就是由一系列盒子组成.这些盒子是按照可见版式在页面上排布的.并由三个属性进行控制:position属性,display属性, ...