jquery获得图片的真实大小
$(function(){
var imgSrc = $("#image").attr("src");
getImageWidth(imgSrc,function(w,h){
console.log({width:w,height:h});
});
}); function getImageWidth(url,callback){
var img = new Image();
img.src = url; // 如果图片被缓存,则直接返回缓存数据
if(img.complete){
callback(img.width, img.height);
}else{
// 完全加载完毕的事件
img.onload = function(){
callback(img.width, img.height);
}
} } 作者:于坤
链接:http://www.zhihu.com/question/28733200/answer/42400792
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
jquery获得图片的真实大小的更多相关文章
- js获取图片的真实大小,字节大小
在我们上传文件的时候,很多时候都要对他做限制,那么怎么在文件上传的时候,就获得这个文件的大小呢?至少在js前台有一个判断的时候,就不会给后台造成更大的压力了,下面就用js来获得文件的大小 <ht ...
- js和jquery获取图片真实的宽度和高度
1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往 ...
- 如何通过js和jquery获取图片真实的宽度和高度
什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都 ...
- Image Wall - jQuery & CSS3 图片墙效果
今天我们要为您展示如何基于 jQuery 和 CSS3 创建一个整洁的图片墙效果.我们的想法是在页面上洒上一些大小不同的缩略图,并在当我们点击图片时候显示丝带,会显示一些描述,再次点击缩略图时,丝带将 ...
- 18款 非常实用 jquery幻灯片图片切换
1.jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动 jquery图片特效制作仿腾讯QQ商城首页banner焦点图片轮播切换效果,带索引按钮控制和左右按钮控制图片切换. 查看演示>& ...
- 自定义控件,上图下字的Button,图片任意指定大小
最近处在安卓培训期,把自己的所学写成博客和大家分享一下,今天学的是这个自定义控件,上图下字的Button安卓自带,但是苦于无法设置图片大小(可以在代码修改),今天自己做了一个,首先看一下效果图,比较实 ...
- jquery裁剪图片插件cropit示例
重装农药第16天!! jquery裁剪图片插件cropit示例 背景:做的手机网页项目,用html file控件上传图片,有些手机拍照后图片会很大,20M以上的,用之前的H5 formdata上传的话 ...
- 【jquery】图片前后对比效果——beforeAfter
今天分享一款 jquery 插件——图片前后对比(beforeAfter),效果如下: 使用方法: <!DOCTYPE HTML> <html lang="en" ...
- 利用jQuery实现图片无限循环轮播(不借助于轮播插件)
原来我主要是用Bootstrap框架或者swiper插件实现轮播图的功能,而这次是用jQuery来实现图片无限循环轮播! 用到的技术有:html.css.JavaScript(少).jQuery(主要 ...
随机推荐
- 调用天气预报webservice
<script src="jquery.js" type="text/javascript" charset="utf-8">& ...
- SSM框架学习之高并发秒杀业务--笔记4-- web层
在前面几节中已经完成了service层和dao层,到目前为止只是后端的设计与编写,这节就要设计到前端的设计了.下面开始总结下这个秒杀业务前端有哪些要点: 1. 前端页面的流程 首先是列表页,点某个商品 ...
- hibernate基于注解的维护权反转:@OneToMany(mappedBy=)
背景说明:首先是SSH环境下,对象基于注解的方式映射到数据库: 昨天遇到一个比较纠结的问题,@OneToMany(mappedBy="xxx"), mappedBy属性有什么用,然 ...
- Java使用ZXing生成二维码条形码
一.下载Zxingjar包 本实例使用的是 zxing3.2.0的版本 下载地址 http://pan.baidu.com/s/1gdH7PzP 说明:本实例使用的3.2.0版本已经使用的java7 ...
- JAVA OOP 基础知识提纲
OOP: 面向对象: 认识事物的一个过程,是整体(特征/行为) 认识事物的方式.人类认识事物的自然思维习惯. 对象及类 对象是实实在在具体存在的东西,主要是从两个角度(行为,特征)去观察 类:是一组具 ...
- ASP.NET中的Session怎么正确使用[转]
Session对象用于存储从一个用户开始访问某个特定的aspx的页面起,到用户离开为止,特定的用户会话所需要的信息.用户在应用程序的页面切换时,Session对象的变量不会被清除. 对于一个Web应用 ...
- JavaWeb chapter 2 Servlet
1. 什么是Servlet: Servlet是运行于Web容器中,按照其自身规范编写的Java应用程序. Servlet是用Java语言编写的,它是一个Java类,因而Servlet遵守所有Java ...
- 从0到1---“保多多”APP的开发(二)
今天继续记录宝多多开发过程中的一些值得注意的知识点: 1.验证车牌格式的正则表达式函数: //车牌号验证 - (BOOL)validateCarNo:(NSString *)carNo { NSStr ...
- 利用反射将Datatable、SqlDataReader转换成List模型
1. DataTable转IList public class DataTableToList<T>whereT :new() { ///<summary> ///利用反射将D ...
- JavaScript基础--DOM对象加强篇(十四)
1.document 对象 定义:document对象代表的整个html文档,因此可以去访问到文档中的各个对象(元素)document重要的函数 1.1 write 向文档输出文本或js代码 1.2 ...