`
chengyue2007
  • 浏览: 1481768 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

javascript获取远程图片的原来的尺寸大小

阅读更多
<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="1.jpg">
<button onclick="s()">获取</button>

 

分享到:
评论

相关推荐

    JavaScript简单获取页面图片原始尺寸的方法

    在网页开发中,有时我们需要获取页面中图片的原始尺寸,比如在实现响应式布局或动态调整图片大小时。JavaScript提供了一种简单的方式,通过`Image`对象来获取图片的宽度和高度,即使图片还未在页面上显示。这种方法...

    php远程图片本地化插件

    - 异步处理:为了防止因下载远程图片阻塞服务器响应,可以使用异步处理,如使用PHP的`pthreads`扩展或配合JavaScript的Ajax请求。 3. **图片保存与管理**: - 图片的命名:可以使用图片的原始URL哈希值作为文件名...

    基于JavaScript的批量图片裁剪插件

    这同样通过`drawImage()`完成,不改变源图片尺寸,保持其原有的宽高比。 7. **钩子函数** 钩子函数是插件的扩展点,允许开发者在特定事件发生时执行自定义代码。例如,"图片加载失败"的钩子可以在图片加载出错时...

    简单易用的vue图片裁剪插件,支持移动图像,裁剪图片,放大缩小图片,上下左右移动,固定比例,固定尺寸,远程图片裁剪

    - **远程图片裁剪**:支持加载网络上的图片进行裁剪,扩展了其适用范围。 2. **代码量小**: - 这个插件的一大优点是实现裁剪功能所需的代码量非常少,开发者可以快速集成到项目中。 3. **自定义参数**: - ...

    JS中通过url动态获取图片大小的方法小结(两种方法)

    总结,这两种方法都是在JavaScript中动态获取远程图片尺寸的有效途径。预加载方式简单但可能造成延迟,而封装的方法更复杂,但能提供更好的用户体验和性能。在实际开发中,根据项目需求和性能要求选择合适的方法至关...

    ajax jquery 常用图片

    使用Ajax的`$.ajax()`或`$.get()`方法,我们可以向服务器发送请求,获取图片的URL,然后利用JavaScript创建新的`&lt;img&gt;`元素插入到DOM中。 jQuery则提供了更简洁的API来处理这些任务。例如,可以使用`$.load()`方法...

    JavaScript网页特效范例宝典源码

    实例043 应用JavaScript实现指定尺寸无边框无滚动条窗口 67 1.8 水平导航条应用 69 实例044 图片按钮导航条 69 实例045 导航条的动画效果 71 实例046 不用图片实现质感导航条 72 1.9 下拉菜单式导航条 73 实例047 二...

    图片上传(水印、缩略图、远程保存)源码.zip

    这个"图片上传(水印、缩略图、远程保存)源码.zip"压缩包包含了一个实现这些功能的源代码集,对于开发者来说,这是一个宝贵的资源,可以深入理解图片处理的各个环节,并且能够快速集成到自己的项目中。 1. **图片...

    web前端期末大作业——基于HTML+CSS+JavaScript蓝色的远程监控设备系统后台管理界面模板

    该项目主要是一个面向学生的期末大作业案例,涉及使用HTML、CSS和JavaScript构建一个蓝色调的远程监控设备系统后台管理界面模板。此项目的目的是帮助学生掌握基本的网页设计技能,包括布局、样式设定以及简单的交互...

    上传图片带预览功能.支持手机微信预览

    5. **跨域问题**:如果预览图片需要从远程服务器获取,可能会遇到跨域问题。可以通过设置服务器的CORS策略或者使用JSONP等方式解决。 6. **安全性考虑**:虽然Base64编码可以方便地在前端展示图片,但它并不能防止...

    上传裁剪图片croppie

    用户完成图片裁剪后,可以调用`result`方法获取裁剪后的图片数据,支持base64或Blob格式: ```javascript cropper.result({ type: 'base64', // 或 'blob' format: 'jpeg' // 可选 'jpeg' 或 'png' }).then...

    php中使用getimagesize获取图片、flash等文件的尺寸信息实例

    1. **预览图显示**:在用户上传图片之前,可以先获取图片尺寸,以便限制上传的大小或比例。 2. **网页布局调整**:根据图片尺寸动态调整网页布局,确保响应式设计。 3. **图片处理**:在缩放、裁剪或旋转图片前,...

    Extjs4 图片浏览器

    8. **Ajax请求**:如果图片存储在远程服务器,可能需要使用Ajax技术异步加载图片数据,提高用户体验。 9. **Layouts(布局)**:根据需要,应用可能采用各种布局方式,如fit布局(适应容器大小)、border布局(分...

    无刷新上传--可生成缩略图--demo.zip

    实现远程上传,需要PHP支持cURL库,通过HTTP/HTTPS协议获取远程文件内容,然后存储到服务器上。 最后,生成缩略图是图像处理的一部分,常用于节省服务器空间和提高页面加载速度。在PHP中,可以使用GD库或Imagick...

    JavaScript应用177例

    30.3.htm 获取浏览器窗口大小 30.4.htm 设置屏幕对象的尺寸 30.5.htm 有选择地显示图片 30.6.htm 简单的性能检测 30.7.htm 模拟浏览器菜单 第31章(\cha31) 31.1....

    js网页PPT效果插件

    同时,可以通过AJAX或Fetch API获取远程数据,实现实时更新内容的功能。 6. 可定制性:好的PPT插件应具备高度的可定制性,允许开发者调整颜色方案、动画速度、过渡效果等。这通常通过暴露API接口或配置选项来实现。...

    Informacoes-do-Cartao-com-JavaScript-e-Bootstrap

    5. **AJAX请求**: 可能使用JavaScript通过AJAX获取远程数据,实时更新卡片内容。 6. **动画效果**: 利用jQuery或其他库添加过渡和动画效果,提升用户体验。 7. **错误处理和调试**: 如何处理可能出现的问题,以及...

    前端入门和进阶学习笔记超详细的图文教程

    AJAX(Asynchronous JavaScript and XML)是实现异步数据交换的技术,而Fetch API是现代浏览器推荐的获取远程资源的方法。了解它们的工作原理和使用方法,能实现页面无刷新的数据更新,提升用户体验。 六、响应式...

    微信小程序项目实例-gank文章图片视频展示(源码+截图)

    4. **API调用**:微信小程序提供了丰富的API,如网络请求API(wx.request)用于获取远程数据,媒体API(wx.getImageInfo、wx.playBackgroundAudio等)用于处理图片和视频的展示,以及文件操作API(wx.saveFile、wx....

    flash实现的鼠标上下滑动缩略图切换大图,也可以点击左右按钮切换大图

    这通常涉及到计算新的缩略图索引,并将对应的全尺寸图片加载到大图区域。 2. **缩略图布局**:缩略图可能以网格或连续条形的方式排列,Flash可以轻松处理这些布局。每个缩略图都是一个独立的MovieClip,包含图片和...

Global site tag (gtag.js) - Google Analytics