js 获取网络图片的高度和宽度的实现方法(变通了下)
无标题文档
原图片是 :尺寸是(215*78)

(function(){
var img=document.createElement('img');//创建一个img元素
img.src="http://www.jb51.net/images/logo.gif";//指定src
img.style.position="absolute";//防止正常的内容变形
img.style.visibility='hidden';//藏起来
var inj=document.getElementById('box').appendChild(img);//插入到box中。当然插入到document.body也可以
alert('宽:'+inj.offsetWidth);//然后就可以通过 offset 取得宽和高了
alert('高:'+inj.offsetHeight);
})();
大家应该能看的到啊,我们
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
js获取图片宽高的方法
本文分享多种js获取图片宽高的方法,并且通过实例进行分析,希望大家从中有所收获. 一.简陋的获取图片方式 // 图片地址 后面加时间戳是为了避免缓存 var img_url = 'upload/2013/13643608813441.jpg?'+Date.parse(new Date()); // 创建对象 var img = new Image(); // 改变图片的src img.src = img_url; // 打印 alert('width:'+img.width+',height:'
-
js获取图片大小的函数代码
1.获取图片大小的函数getImageSize 复制代码 代码如下: function getImageSize(imageEl) { var i = new Image(); //新建一个图片对象 i.src = imageEl.src; //将图片的src属性赋值给新建图片对象的src return new Array(i.width, i.height); //返回图片的长宽像素 //return [i.width, i.height]; } 2.示例 复制代码 代码如下: var img
-
js和jquery如何获取图片真实的宽度和高度
1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 1 复制代码 代码如下: .news img{margin:5px auto; display:block;width:100%; height:auto;} 但是这种方式有另外
-
使用js获取图片原始尺寸
浏览器中显示的图片大小未必是他真实的高和宽,比如像下面这样,我们给他加上宽和高的样式 <img src="IE.png" style="width:25px;height:25px;"> 这样在浏览器中显示的大小就是25px.那么我们如何获取图片的真实大小呢?,下面的代码就实现了这个功能 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta h
-
JS获取图片实际宽高及根据图片大小进行自适应
JS获取图片实际宽高,以及根据图片大小进行自适应 复制代码 代码如下: <img src="http://xxx.jpg" id="imgs" onload="adapt();"/> 复制代码 代码如下: function adapt(){ var tableWidth = $("#imgTable").width(); //表格宽度 var img = new Image(); img.src =$('#imgs
-
关于JS判断图片是否加载完成且获取图片宽度的方法
做web的同学们经常会碰到客户上传图片将网页内容区撑破了的情况,下面就这个问题我们一种如何使用js处理这个问题的方法,具体思路就是在js判断客户端的图片下载完毕之后适时的对该图片的宽度或者高度做一些处理,js处理图片主要是利用js中Image对象,通过 onload 事件和 onreadystatechange 来进行判断. (1)第一中方法,通过onload事件,比如: 复制代码 代码如下: <script type="text/javascript">var obj=n
-
JavaScript获取图片的原始尺寸以宽度为例
页面里的img元素,想要获取它的原始尺寸,以宽度为例可能首先想到的就是width,如下 复制代码 代码如下: <img src="http://img11.360buyimg.com/da/g14/M07/01/0E/rBEhVlNhh8wIAAAAAADmFBLo1twAAM26gOmCgYAAOYs716.jpg"> <script> var img = document.getElementsByTagName('img')[0] var width =
-
javascript 获取图片颜色
利用canvas的2d对象,我们可以获取图片每个像素点的数据 CanvasPixelArray 舜子这里也写了一个简单的 getImageData 的演示 图片取色演示.这个演示目前只能在ff3下运行. 能够获取像素点后,是不是以后的OCR文字识别系统都直接online了呢? 相关资料: http://www.whatwg.org/specs/web-apps/current-work/#dom-context-2d-getimagedata
-
js如何获取网页所有图片
需求 在网页中单击某张图片,图片能放大显示,且能按顺序切换图片,同时,一些小图标和不符合要求的图片不能放大. 由于网页是在app中打开,图片的放大与切换由移动端实现,因此,需要用js调用原生方法,并传递所有图片的url 解决 var img = []; for(var i=0;i<$("img").length;i++){ //获取所有符合放大要求的图片,将图片路径(src)获取 if(parseInt($("img").eq(i).css("wid
-
通过JS获取用户本地图片路径并显示的代码
复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu
随机推荐
- 关于数据库中保留小数位的问题
- JQuery标签页效果实例详解
- 邪恶的eval和new Function使用介绍
- response对象的使用(实例讲解)
- 使用JavaScript实现网页版Pongo设计思路及源代码分享
- Android实现支付宝6位密码输入界面
- Android实战打飞机游戏之子弹生成与碰撞以及爆炸效果(5)
- android编程实现类似于支付宝余额快速闪动效果的方法
- 后台实时分流文件的shell脚本
- ruby线程实现生产者消费者问题示例(队列Queue实现线程同步)
- 原生JS取代一些JQuery方法的简单实现
- C++设计模式编程中Facade外观模式的使用实例解析
- 如何利用“IP地址欺骗”
- 详解C++编程中的主表达式与后缀表达式编写基础
- 深入剖析Java之String字符串
- Android编程滑动效果之倒影效果实现方法(附demo源码下载)
- 自制的文件上传JS控件可支持IE、chrome、firefox etc
- 关于B/S判断浏览器断开的问题讨论
- linux c 获得当前进程的进程名和执行路径(示例)
- 局域网共享上网的几种方法及比较
