js如何获取图片的尺寸

js如何获取图片的尺寸,第1张

项目的需求是上传一张,然后验证该的尺寸,如果跟预期的不符,就不给上传

首先,可以通过new FileReader(),再通过将上传的文件传给实例的readAsDataUrl(),当文件加载完成触发onload事件,传递event,通过eventtargetresult来获取的链接(base64格式的)

接着,new Image()实例,将上面获取的链接设置为的src属性,当加载完成触发onload事件就可以通过width、height属性来读取的长宽啦~~

rgb在js中意思是三原色色彩模式。根据查询相关公开信息显示:RGB色彩模式是工业界的一种颜色标准,是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的,RGB即是代表红、绿、蓝三个通道的颜色,这个标准几乎包括了人类视力所能感知的所有颜色,是运用最广的颜色系统之一。

捕获指定位置的RGB像素值。avaScript取色器的原理是通过从屏幕中捕获指定位置的RGB像素值实现的,当用户在屏幕上选择一个颜色时,JavaScript会计算该颜色的RGB值,并将其作为结果返回给用户,取色器通常将这个RGB值转换为十六进制颜色值,以方便在CSS或HTML中使用。取色器是一款能实时取色的颜色识别软件,拥有强大的颜色识别,颜色提取,颜色调节,色值转换,常用颜色列表等功能,让你轻松快捷的提取任何需要的颜色。

<!DOCTYPE html>

<html>

<head>

<title>getHexColor js/jQuery 获得十六进制颜色</title>

<meta charset="utf-8" />

<script type="text/javascript">

function getHexBgColor(){

var str = [];

var rgb = documentgetElementById('color')stylebackgroundColorsplit('(');

for(var k = 0; k < 3; k++){

str[k] = parseInt(rgb[1]split(',')[k])toString(16);

}

str = '#'+str[0]+str[1]+str[2];

documentgetElementById('color')innerHTML = str;

}

function getHexColor(){

var str = [];

var rgb = documentgetElementById('color')stylecolorsplit('(');

for(var k = 0; k < 3; k++){

str[k] = parseInt(rgb[1]split(',')[k])toString(16);

}

str = '#'+str[0]+str[1]+str[2];

documentgetElementById('color')innerHTML = str;

}

</script>

<style type="text/css">

#color{

width: 200px;

height: 200px;

line-height: 200px;

text-align: center;

}

</style>

</head>

<body>

<div style="color: #88ee22; background-color: #ef8989;" id="color"></div>

<input onclick="getHexBgColor();" type="button" value="获得背景色" />

<input onclick="getHexColor();" type="button" value="获得字体颜色" />

</body>

</html>

点击“获得背景色”按钮,会调用getHexBgColor()方法获取css的背景色。

以上就是关于js如何获取图片的尺寸全部的内容,包括:js如何获取图片的尺寸、rgb在js中什么意思、js取色器原理等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9484051.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-28
下一篇 2023-04-28

发表评论

登录后才能评论

评论列表(0条)

保存