.naturalWidth 和naturalHeight属性,
在HTML 5中,新增加了两个用来判断图片的宽度和高度的属性,分别为
.naturalWidth 和naturalHeight属性,例子如下:
var rw = myimage.naturalWidth; // 真实图片宽度
var rh = myimage.naturalHeight; //真是图片高度
但有个前提是,必须在图片完全下载到客户端浏览器才能判断,
,目前在ie 9,Firefox, Chrome, Safari 和Opera都是可以使用的,
如果是不支持的版本浏览器,那可以用传统方法判断,如下:
var myimage = document.getElementById("myimage");
if (typeof myimage.naturalWidth == "undefined") {
// IE 6/7/8
var i = new Image();
i.src = myimage.src;
var rw = i.width;
var rh = i.height;
}
else {
// HTML5 browsers
var rw = myimage.naturalWidth;
var rh = myimage.naturalHeight;
}
.naturalWidth 和naturalHeight属性,的更多相关文章
- naturalWidth 与 naturalHeight
在HTML 5中,新增加了两个用来判断图片的宽度和高度的属性(图片原始大小),分别为 naturalWidth 和naturalHeight属性,例子如下: 注意问题: - 图片没有加载的时候 值为0 ...
- naturalWidth与naturalHeight
naturalWidth与naturalHeight是HTML5的新属性, 可与通过这两个属性来直接获取图片的原始宽度和高度, 现在在火狐, 谷歌, IE11均已经实现 可以看看naturalWidt ...
- naturalWidth、naturalHeight来获取图片的真实宽高
一般在图片放大缩小,或动态插入图片时使用 function imagea(img){ var w = img.naturalWidth; var h = img.naturalHeight; } 注: ...
- Javascript获取图片原始宽度和高度的方法详解
前言 网上关于利用Javascript获取图片原始宽度和高度的方法有很多,本文将再次给大家谈谈这个问题,或许会对一些人能有所帮助. 方法详解 页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能 ...
- JQuery Mobile - 处理图片加载失败!
重点来了:一定要记住error事件不冒泡(如果要用js的方法替换默认出错图片,记得把img的alt属性去掉). 相关的知识点:jquery的ready方法.$("img").err ...
- JS获取图片的原始宽度和高度
页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能首先想到的是元素的innerWidth属性,或者jQuery中的width()方法.如下: <img id="img" ...
- 当h5页面图片加载失败后,给定一个默认图
本文主要讨论页面中图片加载失败后替换默认图片的几种方式 重点来了:一定要记住error事件不冒泡. 相关的知识点:jquery的ready方法.$("img").error().i ...
- Html5+asp.net mvc 图片压缩上传
在做图片上传时,大图片如果没有压缩直接上传时间会非常长,因为有的图片太大,传到服务器上再压缩太慢了,而且损耗流量. 思路是将图片抽样显示在canvas上,然后用通过canvas.toDataURL方法 ...
- viewer.js图片查看器插件(可缩放/旋转/切换)
<!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...
随机推荐
- Mysql bench执行sql语句批量操作数据所遇到的问题
一.错误 rror Code: 1175. You are using safe update mode and you tried to update a table without a WHERE ...
- mysqlbinglog基于即时点还原
mysqlbinlog介绍 要想从二进制日志恢复数据,你需要知道当前二进制日志文件的路径和文件名.一般可以从选项文件(即my.cnf or my.ini,取决于你的系统)中找到路径. (mysql5. ...
- Logistic Regression vs Decision Trees vs SVM: Part II
This is the 2nd part of the series. Read the first part here: Logistic Regression Vs Decision Trees ...
- thinkphp 的create()非法数据解决办法
是因为create()方法默认是使用post传值的,把from表单的传值方法改成post就行了,默认是get.
- c语言中的文件流
一.打开和关闭文件 #include int main( void ) { FILE* pReadFile = fopen( "E:\\mytest.txt", "r&q ...
- hdu Sudoku Killer
简单的dfs,主要就是每个?处填的值是否满足条件的判断.这道题感觉考察的是输出格式的控制. #include"iostream" #include"stdio.h&quo ...
- 安装时遇到:正在尝试其它镜像。 http://mirrors.btte.net/centos/7.2.1511/extras/x86_64/repodata/repomd.xml: [Errno 14] curl#6 - "Could not resolve host: mirrors.btte.net; 未知的错误"
我出现这种错误是因为网络链接问题,因为我设置虚拟机网络链接为VmNET8,设置了nat模式,使得我本地机可以访问虚拟机的linux服务器.但是打开虚拟机的浏览器却不能上网了.所以现在我用xshell装 ...
- 对ASM存储管理的一些初步理解记录
ASM:Automatic Storage Management,是ORACEL10G以后为了简化存储管理的复杂性,也是为了摆脱对其他厂商的依赖而推出的.ASM作为目前ORACLE推荐的首选存储方案, ...
- flume+elasticsearch
项目的日志服是使用flume+elasticsearch 但是运维大哥告诉我,经常会大量往外发包,以至流量超标.问我是不是程序有问题.当时我拍着胸膛说:肯定不是.他说,可能是 服务器被攻击了,让我换一 ...
- ready是先执行的,load后执行,DOM文档的加载步骤
在jq中在文档载入完毕后有这几种方式去执行指定函数: $(document).ready(function() { // ...代码... }); //document ready 简写 $(func ...