首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

获取图像尺寸(高度和宽度) Js或jquery

获取图像尺寸(高度和宽度)可以使用JavaScript或jQuery来实现。

在JavaScript中,可以使用Image对象的属性来获取图像的尺寸。具体步骤如下:

  1. 创建一个Image对象:var img = new Image();
  2. 设置图像的src属性为图像的URL:img.src = "image.jpg";
  3. 在图像加载完成后,可以通过img.naturalWidthimg.naturalHeight属性获取图像的宽度和高度。

以下是一个完整的示例代码:

代码语言:txt
复制
var img = new Image();
img.src = "image.jpg";
img.onload = function() {
  var width = img.naturalWidth;
  var height = img.naturalHeight;
  console.log("图像宽度:" + width);
  console.log("图像高度:" + height);
};

在jQuery中,可以使用$()函数创建一个图像元素,并使用width()height()方法来获取图像的宽度和高度。具体步骤如下:

  1. 创建一个图像元素:var img = $("<img />");
  2. 设置图像的src属性为图像的URL:img.attr("src", "image.jpg");
  3. 在图像加载完成后,可以使用img.width()img.height()方法获取图像的宽度和高度。

以下是一个完整的示例代码:

代码语言:txt
复制
var img = $("<img />");
img.attr("src", "image.jpg");
img.on("load", function() {
  var width = img.width();
  var height = img.height();
  console.log("图像宽度:" + width);
  console.log("图像高度:" + height);
});

这种方法适用于获取已加载的图像的尺寸。如果图像尚未加载完成,尺寸可能不准确。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

JavaScript、Jquery获取屏幕的宽度高度

在日常的项目中经常需要获取屏幕的宽度或者高度,简单记录一下: Javascript方法获取: document.body.clientWidth //网页可见区域宽 document.body.clientHeight...window.screen.availWidth //屏幕可用工作区宽度 JQuery方法获取: ($(window).height()); //浏览器当前窗口可视区域高度 ($(document)....height()); //浏览器当前窗口文档的高度 ($(document.body).height());//浏览器当前窗口文档body的高度 ($(document.body).outerHeight...(true));//浏览器当前窗口文档body的总高度 包括border padding margin ($(window).width()); //浏览器当前窗口可视区域宽度 ($(document)....width());//浏览器当前窗口文档对象宽度 ($(document.body).width());//浏览器当前窗口文档body的宽度 ($(document.body).outerWidth(

5.3K00

GtkSharp 获取触摸宽度高度面积尺寸信息

本文将告诉大家如何在 C# dotnet 里面,从 GTK 里面获取到触摸的宽度高度信息,即触摸面积触摸尺寸信息 准确来说本文的方法是我在 lsj 的帮助下试出来的,我没有找到正式的文档对此有描述。...从官方的定义上可以看到 axes 是一个 double 类型的数组,我就从数组里面的第 3、4 项分别获取到 [0-1] 范围内的宽度高度的值。...但从实际测试上看,这个值却能够触摸的宽度高度对应 接下来我将使用一个简单的项目告诉大家具体如何获取触摸宽度高度信息 先新建一个控制台项目,然后编辑 csproj 项目文件,替换为如下代码 <Project...可以使用分辨计算 x y 的缩放比从而获取到像素单位的触摸尺寸 if (numAxes >= 5) { var radioX...radioY; Console.WriteLine($"Width={width} Height={height}"); } 通过以上方法即可获取到触摸点的宽度高度

16610
  • OC中获取一串字符串的高度宽度确定)宽度高度确定)

    https://blog.csdn.net/u010105969/article/details/52937475 项目中我们有时会需要根据字符串来确定UILabel的宽度高度,如我们经常遇到的单元格自适应问题...如果是要动态知道UILabel的高度,那么我们直接利用单元格自适应高度就可以。如果我们要获取UILabel的宽度(为什么要获取UILabel的宽度?...因为有时如果字符串过长那么UILabel的宽度就会相应发生变化),那么就可以利用下面的方法: CGSize size = [string sizeWithFont:font constrainedToSize...:CGSizeMake(MAXFLOAT, 17)];  CGFloat w =size.width; 其实这个方法只是先获取字符串(字符串的字体大小是确定了的)的size再确定其宽度。...从方法中可以看出我们固定了字符串的高度为17,如果想要获取字符串的高度,那么固定宽度就好了。

    2.5K30

    js 获取浏览器高度宽度值(多浏览器)

    scrollLeft:设置获取位于对象左边界窗口中目前可见内容的最左端之间的距离 scrollTop:设置获取位于对象最顶端窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面由 offsetParent 属性指定的父坐标的计算左侧位置...offsetTop:获取对象相对于版面由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX 相对文档的水平座标 event.clientY 相对文档的垂直座标...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度...-- var winWidth = 0; var winHeight = 0; function findDimensions() //函数:获取尺寸 { //获取窗口宽度 if (window.innerWidth

    10.4K60

    js 获取浏览器高度宽度值(多浏览器)

    ,offsetWidth scrollHeight: 获取对象的滚动高度。...scrollLeft:设置获取位于对象左边界窗口中目前可见内容的最左端之间的距离 scrollTop:设置获取位于对象最顶端窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度...-- var winWidth = 0; var winHeight = 0; function findDimensions() //函数:获取尺寸 { //获取窗口宽度 if (window.innerWidth

    5.6K10

    js 获取浏览器高度宽度值(多浏览器)

    ,offsetWidth scrollHeight: 获取对象的滚动高度。...scrollLeft:设置获取位于对象左边界窗口中目前可见内容的最左端之间的距离 scrollTop:设置获取位于对象最顶端窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度...-- var winWidth = 0; var winHeight = 0; function findDimensions() //函数:获取尺寸 { //获取窗口宽度 if (window.innerWidth

    7.7K80

    js获得浏览器高度宽度 参数

    ==> 可见区域高度 在FireFox中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度...==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)...(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) Opera为: document.documentElement.clientWidth...==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) /.../获取滚动条的高度 function getPageScroll(){ var yScroll; if (self.pageYOffset) { yScroll = self.pageYOffset

    6.1K41

    如何在onCreate中获取View的高度宽度

    如何在onCreate中获取View的高度宽度 在开发过程中经常需要获取到View的宽和高,可以通过View.getWidth()View.getHeight()来得到宽高。...只有经过“测量”“布局”之后,View才能正确地完成绘制。而这一切是发生在onCreate方法之后的。...所以在onCreate中直接使用View.getWidth()View.getHeight()是无法得到正确的值的。 那应该怎么onCreate中获取View的宽高呢?...开发者可以通过View.post()方法来获取到View的宽高,该方法传递一个Runnable参数,然后将其添加到消息队列中,最后在UI线程中执行。...savedInstanceState); view.post(new Runnable(){ public void run(){ //在这里使用View.getWidth()View.getHeight

    5.3K20

    JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度

    scrollLeft:设置获取位于对象左边界窗口中目前可见内容的最左端之间的距离 scrollTop:设置获取位于对象最顶端窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面由 offsetParent 属性指定的父坐标的计算左侧位置...-- var winWidth = 0; var winHeight = 0; function findDimensions() //函数:获取尺寸 { //获取窗口宽度...(2)在随后的JavaScript代码中,首先定义了两个变量winWidthwinHeight,用于保存窗口的高度宽度值。...(3)然后,在函数findDimensions ( )中,使用window.innerHeightwindow.innerWidth得到窗口的高度宽度,并将二者保存在前述两个变量中。

    8.1K30

    JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度(转)

    scrollLeft:设置获取位于对象左边界窗口中目前可见内容的最左端之间的距离  scrollTop:设置获取位于对象最顶端窗口中可见内容的最顶端之间的距离  scrollWidth:获取对象的滚动宽度...  offsetHeight:获取对象相对于版面由父坐标 offsetParent 属性指定的父坐标的高度  offsetLeft:获取对象相对于版面由 offsetParent 属性指定的父坐标的计算左侧位置...--  var winWidth = 0; var winHeight = 0; function findDimensions() //函数:获取尺寸 { //获取窗口宽度 if (window.innerWidth...(2)在随后的JavaScript代码中,首先定义了两个变量winWidthwinHeight,用于保存窗口的高度宽度值。...(3)然后,在函数findDimensions ( )中,使用window.innerHeightwindow.innerWidth得到窗口的高度宽度,并将二者保存在前述两个变量中。

    16.2K10
    领券