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和jquery如何获取图片真实的宽度和高度
1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 1 复制代码 代码如下: .news img{margin:5px auto; display:block;width:100%; height:auto;} 但是这种方式有另外
-
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 =
-
关于JS判断图片是否加载完成且获取图片宽度的方法
做web的同学们经常会碰到客户上传图片将网页内容区撑破了的情况,下面就这个问题我们一种如何使用js处理这个问题的方法,具体思路就是在js判断客户端的图片下载完毕之后适时的对该图片的宽度或者高度做一些处理,js处理图片主要是利用js中Image对象,通过 onload 事件和 onreadystatechange 来进行判断. (1)第一中方法,通过onload事件,比如: 复制代码 代码如下: <script type="text/javascript">var obj=n
-
通过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
-
js如何获取网页所有图片
需求 在网页中单击某张图片,图片能放大显示,且能按顺序切换图片,同时,一些小图标和不符合要求的图片不能放大. 由于网页是在app中打开,图片的放大与切换由移动端实现,因此,需要用js调用原生方法,并传递所有图片的url 解决 var img = []; for(var i=0;i<$("img").length;i++){ //获取所有符合放大要求的图片,将图片路径(src)获取 if(parseInt($("img").eq(i).css("wid
-
使用js获取图片原始尺寸
浏览器中显示的图片大小未必是他真实的高和宽,比如像下面这样,我们给他加上宽和高的样式 <img src="IE.png" style="width:25px;height:25px;"> 这样在浏览器中显示的大小就是25px.那么我们如何获取图片的真实大小呢?,下面的代码就实现了这个功能 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta h
-
javascript 获取图片颜色
利用canvas的2d对象,我们可以获取图片每个像素点的数据 CanvasPixelArray 舜子这里也写了一个简单的 getImageData 的演示 图片取色演示.这个演示目前只能在ff3下运行. 能够获取像素点后,是不是以后的OCR文字识别系统都直接online了呢? 相关资料: http://www.whatwg.org/specs/web-apps/current-work/#dom-context-2d-getimagedata
-
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获取图片实际宽高及根据图片大小进行自适应
JS获取图片实际宽高,以及根据图片大小进行自适应 复制代码 代码如下: <img src="http://xxx.jpg" id="imgs" onload="adapt();"/> 复制代码 代码如下: function adapt(){ var tableWidth = $("#imgTable").width(); //表格宽度 var img = new Image(); img.src =$('#imgs
随机推荐
- C++用new创建对象和不用new创建对象的区别解析
- Java实现时间动态显示方法汇总
- asp.net下降文本格式数据导入到数据库中的代码
- swift实现自定义圆环进度提示效果
- Nodejs+express+html5 实现拖拽上传
- Android绘制炫酷引导界面
- PHP守护进程的两种常见实现方式详解
- 基于JQuery的实现图片轮播效果(焦点图)
- C++实现数字转换为十六进制字符串的方法
- 详解阿里云LINUX服务器配置HTTPS(NGINX)
- 用JavaScript实现PHP的urlencode与urldecode函数
- js Firefox 加入收藏夹功能代码 兼容Firefox 和 IE
- My Desktop :) 桌面式代码
- java javax.annotation.Resource注解的详解
- Android中的Adapter简单介绍
- 在ASP.NET 2.0中操作数据之四十二:DataList和Repeater数据排序(一)
- C与C++动态分配二维数组的实现方法
- Android仿QQ好友详情页下拉顶部图片缩放效果
- Android开发使用URLConnection进行网络编程详解
- 详解Vue取消eslint语法限制