`

用JS得到图片的大小及长、宽

    博客分类:
  • WEB
 
阅读更多
<script>
var img=null;
function s()
{
if(img)img.removeNode(true);
img=document.createElement("img");
img.style.position="absolute";
img.style.visibility="hidden";
img.attachEvent("onreadystatechange",orsc);
img.attachEvent("onerror",oe);
document.body.insertAdjacentElement("beforeend",img);
img.src=inp.value;
}
function oe()
{
alert("cant load img");
}
function orsc()
{
if(img.readyState!="complete")return false;
alert(img.offsetHeight+":"+img.offsetWidth);
}
</script>
<input id=inp style="width:400" value="images/logo.gif">
<br>
<button onclick="s()">show</button>

 

分享到:
评论

相关推荐

    js 图片上传前大小长宽验证代码

    通过`new Image()`来创建图片对象,并且在该对象加载完成后,可以通过访问对象的属性来获得图片信息。 #### 3. 文件信息的获取 在JavaScript中,`File`对象表示一个文件。可以通过HTML表单中的`&lt;input type="file"&gt;...

    上传图片客户端判断大小,javascript获得上传图片的大小

    不用IE控件(ActiveXObject)不用 Img属性 上传图片客户端判断大小,javascript获得上传图片的大小 兼容所有浏览器,亲测可用 判断文件大小,判断上传图片的大小,图片格式

    js解决div内图片自适应大小

    本文将深入探讨如何利用纯JavaScript实现img图片在大小未知的div内自适应显示,并兼容不同浏览器,包括火狐、谷歌和IE6/7/8。 首先,我们来看一下基本的HTML结构,它包含一个div容器和一个img元素: ```html `...

    js实现鼠标滚轮控制图片缩放效果的方法

    本文将详细介绍如何使用JavaScript来实现通过鼠标滚轮控制图片缩放效果的方法,其中将涉及onmousewheel事件的使用以及JavaScript操作DOM来调整图片大小的技巧。 首先,我们应当理解onmousewheel事件。这是一个鼠标...

    JS 图片选中区域坐标

    在JavaScript(JS)中处理图片选中区域坐标是一项常见的任务,尤其在图像编辑、标注或交互式应用中。本文将深入探讨如何实现这一功能,并提供相关的编程知识点。 首先,我们需要理解基本概念。在HTML中,我们可以...

    js前端图片预览插件

    **JavaScript前端图片预览插件详解** 在网页开发中,图片预览是一个常见的需求,它允许用户在上传或查看图片前进行预览操作。本文将详细介绍一个基于JavaScript实现的前端图片预览插件,该插件利用HTML5的Canvas...

    CSS限制图片大小

    ` 使用了JavaScript表达式来动态计算图片的宽度,当图片的原始宽度大于600像素时,将其限制为600像素,否则保持原宽。 #### 四、使用`height`属性自动调整高度 在调整图片宽度的同时,我们还需要考虑高度的变化。...

    纯js实现div内图片自适应大小(已测试,兼容火狐)

    在某些情况下,图片的宽高比可能都大于或等于div的宽高比,此时我们需要找到两者之间的最大值,然后用这个最大值作为比例调整图片大小。 3. 调整图片位置: 在调整图片大小后,可能会出现图片的高度小于div的情况...

    js版图片在线裁剪,

    JavaScript 图片在线裁剪技术详解 在Web开发中,用户经常需要上传并处理图片,例如社交媒体的头像、产品图片等。为了满足这种需求,JavaScript提供了实现图片在线裁剪的功能,使得用户可以在浏览器端直接对图片进行...

    js 压缩图片上传

    本文将详细讲解如何使用JavaScript进行图片压缩上传,同时结合C#后端处理,以及支持的浏览器环境。 首先,我们需要了解JavaScript中的HTML5 Canvas API。Canvas是一个二维绘图表面,可以用于动态图形绘制和图像处理...

    jQuery响应式自适应浏览器窗口大小图片排列代码.zip

    3. 缩放图片:根据每个图片的原生宽高比,使用CSS的`width`和`height`属性或者`transform: scale()`来调整图片大小,使其适应新的容器高度,同时保持比例。 4. 监听窗口大小变化:使用`$(window).resize()`函数监听...

    vue实现在图片中画矩形框,并得到对角坐标,设置map中area的样式.zip

    例如,可以改变`&lt;map&gt;`的边框或填充颜色,或者使用JavaScript动态改变`area`的`href`属性来模拟样式变化。 5. **在Vue中操作`&lt;map&gt;`和`&lt;area&gt;`**: - 在Vue组件中,你可以利用数据绑定来控制`&lt;area&gt;`的`coords`...

    JavaScript限定图片显示大小的方法

    该函数的主要作用是根据给定的最大宽度(`limitW`)和最大高度(`limitH`)来调整图片组件(`thisobj`)的显示大小,以确保图片不会超出设定的限制,同时保持原始宽高比。 首先,我们来看看`imageResize`函数的参数: 1. ...

    js获取图片大小的函数代码

    ### 获取图片大小的JavaScript函数详解 在Web开发中,经常需要获取图片的尺寸信息以便进行进一步的操作或优化页面布局。本文将详细介绍一种通过JavaScript来获取图片尺寸的方法,并对其原理及应用进行深入剖析。 #...

    rowGrid.js响应式图片水平对齐插件

    rowGrid.js插件就是这一理念的实践,它通过灵活的CSS和JavaScript技术,使得图片在不同分辨率下都能够整齐地排列,避免了图片大小不一、错位或重叠的问题。 在使用rowGrid.js时,开发者首先需要在HTML中定义包含...

    JS实现压缩上传图片base64长度功能

    在本文中,我们将探讨如何使用JavaScript实现压缩上传图片的功能,特别是关注如何减少base64编码后的图片数据长度。这个过程对于优化图像在网络中的传输效率,减少服务器存储空间,以及提高用户体验都是至关重要的。...

    基于JavaScript获取base64图片大小

    在JavaScript中,获取基于Base64编码的图片大小是一个常见的需求,这有助于处理与图片相关的内存管理和性能优化。Base64是一种将二进制数据转换为可打印ASCII字符的编码方式,广泛应用于在网络上传输非文本数据,如...

    js获取图片长和宽度的代码

    ### JavaScript 获取图片尺寸的方法 在Web开发中,经常需要动态获取图片的尺寸信息,以便进行页面布局调整或响应式设计。下面将详细介绍如何利用JavaScript来获取图片的长度(宽度)和高度。 #### 1. 基本原理 在...

    jQuery响应式宽屏图片3D旋转切换特效

    在这个特效中,响应式布局是通过媒体查询(Media Queries)实现的,可以根据浏览器窗口的大小调整图片的排列方式和切换效果,无论是桌面电脑、平板还是手机,用户都能获得一致的视觉体验。 宽屏图片3D旋转切换特效...

    嵌入到HTML的iframe自动适应大小

    - 最后,将计算得到的内部文档高度赋值给iframe的`height`样式属性,实现高度的自动调整。 3. **兼容性处理**:为了确保在不支持iframe或需要显示隐藏iframe的情况下也能正常工作,代码还提供了额外的处理逻辑,如...

Global site tag (gtag.js) - Google Analytics