获取图片实际宽高及根据图片大小进行自适应代码,Js代码库,德仔网

代码语言

代码分类

【Js】获取图片实际宽高及根据图片大小进行自适应

作者:煜炫 / 发布于2016/5/23/ 832

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>

试试其它关键字

同语言下

.Jquery搜索框获取回车事件
.H5页面添加倒计时，然后自动跳转
.通过user-agent判断h5页面是在哪个手机App（QQ、微信
.nginx 禁止未绑定的域名访问
.JavaScript 获取按键，并屏蔽系统 Window 事件
.H5之只允许微信浏览器打开，禁止从外部浏览器访问
.微信打开网址添加在浏览器中打开提示的办法
.实现JS复制、粘贴，Chrome/Firefox下可用
.video视频播放，play()、pause()、duration时长、onen
.HTML5实现MP3上传前的预览和播放时长的获取

可能有用的

.Jquery搜索框获取回车事件
.H5页面添加倒计时，然后自动跳转
.通过user-agent判断h5页面是在哪个手机App（QQ、微信
.nginx 禁止未绑定的域名访问
.JavaScript 获取按键，并屏蔽系统 Window 事件
.H5之只允许微信浏览器打开，禁止从外部浏览器访问
.微信打开网址添加在浏览器中打开提示的办法
.实现JS复制、粘贴，Chrome/Firefox下可用
.video视频播放，play()、pause()、duration时长、onen
.HTML5实现MP3上传前的预览和播放时长的获取

煜炫贡献的其它代码(14)

.List