JS将获取到的RGB转换为HSL
//RGB 颜色值转换为 HSL.
//转换公式参考自 .
//r, g, 和 b 需要在 [0, 255] 范围内
//返回的 h, s, 和 l 在 [0, 1] 之间
//Number r 红色色值
//Number g 绿色色值
//Number b 蓝色色值
//Array HSL各值数组
function RgbToHsl(r, g, b) {
r /= 255, g /= 255, b /= 255;
var max = Math.max(r, g, b), min = Math.min(r, g, b);
var h, s, l = (max + min) / 2;
if (max == min) {
h = s = 0;
} else {
var d = max - min;
s = l 0.5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r: h = (g - b) / d + (g b ? 6 : 0); break;
case g: h = (b - r) / d + 2; break;
case b: h = (r - g) / d + 4; break;
}
h /= 6;
}
return [Math.floor(h * 100), Math.round(s * 100) + "%", Math.round(l * 100) + "%"];
}
参考改写的，希望对你有用。
jsp页面上怎么用javascript获取base64编码的图片的大小
可以使用Image对象来获取图片的像素大小，代码如下：
var img = new Image()
img.src = base64;（图片的base64编码字符串）
img.height即为图片的高度
img.width即为图片的宽度
js如何算出浏览器的像素是多少像素每英寸
网页可见区域宽：document.body.clientwidth
网页可见区域高：document.body.clientheight
网页可见区域宽：document.body.offsetwidth (包括边线和滚动条的宽)
网页可见区域高：document.body.offsetheight(包括边线的宽)
网页正文全文宽：document.body.scrollwidth
网页正文全文高：document.body.scrollheight
网页被卷去的高：document.body.scrolltop
网页被卷去的左：document.body.scrollleft
网页正文部分上：window.screentop
网页正文部分左：window.screenleft
屏幕分辨率的高：window.screen.height
屏幕分辨率的宽：window.screen.width
屏幕可用工作区高度：window.screen.availheight
屏幕可用工作区宽度：window.screen.availwidth
屏幕设置 window.screen.colordepth 位彩色
屏幕设置 window.screen.devicexdpi 像素/英寸
分享一些js判断屏幕分辨率的代码。
一般可以通过下面的代码判断分辨率
复制代码代码示例:
script language="javascript"
!-- begin
function redirectpage() {
var wjb51=screen.width;
var hjb51=screen.height;
alert("经系统检测，你的屏幕分辨率为 " + wjb51+"*"+ hjb51 + "by 脚本之家jb51.net");
}
// end --
/script
js判断浏览器分辨率
复制代码代码示例:
script
function screenwidth(){
if (screen.width == 1440){
alert("1440*900");
}else if (screen.width == 800){
alert("800*600");
}else if (screen.width == 1152){
alert("1152*864");
}else {
alert("do not know!");
}
}
/script
input type="button" name="" value="fenbianli " onclick=" screenwidth()"/
说明：这段js代码可改造一下，改为screen.width=1024 screen.width=800两种情况
所以，选择使用下面的代码：
复制代码代码示例:
if(screen.width=1440){
alert('宽屏幕可以加载广告了');
//一些广告代码
}
用js判断不同分辨率调用不同的css样式文件
根据显示器不同的分辨率，样式文件调用的也不一样。
复制代码代码示例:
!doctype html
html
head
meta charset="utf-8"
titlejs判断不同分辨率调用不同的css样式_;/title
link rel="stylesheet" id="sc" type="text/css" href="css/c1.css"/
script type="text/javascript"
window.onload=function(){
var sc=document.getelementbyid("sc");
var d=document.getelementbyid("d");
if(screen.width1024) //获取屏幕的的宽度
{
sc.setattribute("href","css/c2.css"); //设置css引入样式表的路径
d.innerhtml = "你的电脑屏幕宽度大于1024，我的宽度是 1200px, 背景色现在是红色。";
}
else{
sc.setattribute("href","css/c1.css");
d.innerhtml = "你的电脑屏幕宽度小于或是等于1024，我的宽度是 960px, 背景色现在是蓝色。";
}
}
/script
/head
body
div id="d"/div
/body
/html
c1.css中内容
复制代码代码示例:
*{ margin:0; padding:0;}
div{ width:960px; height:400px; margin:0 auto; background:blue; color:#ffffff;}
c2.css中内容
复制代码代码示例:
*{ margin:0; padding:0;}
div{ width:1200px; height:400px; margin:0 auto; background:red; color:#fff;}
Javascript如何获取图片中某个像素点的RBG值
function RGB(rgb){
var regexp = /[0-9]{0,3}/g;
var re = rgb.match(regexp);
alert(re);
for(var i=0;i
if(re[i]==""){
re.splice(i,1);
i--;
}
}
alert(re);
}
-----------------------------------
转换成16进制
function RGBToHex(rgb){
var regexp = /[0-9]{0,3}/g;
var re = rgb.match(regexp);//利用正则表达式去掉多余的部分，将rgb中的数字提取
var hexColor = "#"; var hex = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
for (var i = 0; i re.length; i++) {
var r = null; var c = re[i];
var hexAr = [];
while (c 16){
r = c % 16;
c = (c / 16) 0;
hexAr.push(hex[r]);
} hexAr.push(hex[c]);
if(c 16c != ""){
hexAr.push(0)
}
hexColor += hexAr.reverse().join('');
}
//alert(hexColor)
return hexColor;
}
js获取分辨率和缩放页面的方法
var screen = window.screen;//获取分辨率
screen.width；//获取分辨率的宽度
screen.height；//获取分辨率的高度
//页面缩放比例设置方法
document.getElementsByTagName('body')[0].style.zoom=0.67 //该方法将页面设置比例调整为67%
JS canvas 怎么获取梯形的像素数据
ctx.getImageData()可以返回你所需要的像素数据。
如下例子
!DOCTYPE html
html
body
canvas id="canvas" width="300" height="150" style="border:1px solid #000;"
Your browser does not support the HTML5 canvas tag.
/canvas
script
var c=document.querySelector("#canvas");
var ctx=c.getContext("2d");
ctx.fillStyle="green";
ctx.fillRect(10,10,50,50);
function copy()
{
var imgData=ctx.getImageData(20,20,50,50);
ctx.putImageData(imgData,20,60);
}
/script
button onclick="copy()"copy/button
/body
/html