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 ...
随机推荐
- VirtualBox 导入.vdi文件时报“uuid is exists”错误
解决办法: 1.要安装的.vdi文件所在目录:D:\developTools\vm\RedHatLinux1.vdi 2.找到VirtualBox的安装目录,这里是D:\Program Files\O ...
- In-Memory:Hash Index
SQL Server 2016支持哈希查找,用户可以在内存优化表(Memory-Optimized Table)上创建Hash Index,使用Hash 查找算法,实现数据的极速查找.在使用上,Has ...
- 【Android 界面效果38】android:inputType常用取值
<EditText android:layout_width="fill_parent" android:layout_height="wrap_content&q ...
- 关于Django中的表单验证
ModelForm 和 普通的Form 都可以做表单验证 对于ModelForm如果只是想验证其中一部分model中的field,可以指定:内部类Meta的fields元素: fields = ('x ...
- property在括号中应该怎样写
property 属性的定义,类似于get set assign: 简单的赋值,不更改索引计数 使用assign是针对基础的数据类型,比如NSinterger,CGFloat和c数据类型(int fl ...
- 重构2-Move Method(方法移动)
重构同样非常简单,以至于人们并不认为这是一个有价值的重构.迁移方法(Move Method),顾名思义就是将方法迁移到合适的位置.在开始重构前,我们先看看一下代码: ) ) return 0.03; ...
- MyEclipse设置编码方式 转载【http://www.cnblogs.com/susuyu/archive/2012/06/27/2566062.html】
1.windows->Preferences……打开"首选项"对话框,左侧导航树,导航到general->Workspace, 右侧Text file encoding ...
- hdu-5505(数论)
题目链接: GT and numbers Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Ot ...
- ZWave for Arduino
https://sites.google.com/site/arduinozwave/http://www.ebay.com/sch/i.html?_trksid=p2050601.m570.l131 ...
- selenium遍历控件集合
场景:需要重复增加地址栏信息,如果地址信息超过了5个就不开始增加 如图: 1.找到控件集合,在遍历每个子元素,在进行选择 1.先找到最外层的div的控件集合 2.外层的css定位为: int star ...