1. 如何用js自動獲取圖片的背景顏色,急急急...
div 裡面background設置屬性
background:url('圖片地址') 0 0 no-repeat ;
background-size:100% 100%;
就可以了
上面background 的 0 0 是 x y 軸的偏移量 no-repeat是如果背景圖片不重復出現
2. 如何js php 識別一張圖片的主要8種顏色並輸出每個顏色的代碼#222222
在機器視覺系統中,對RGB和YUV兩種不同顏色空間進行研究,應用相差法進行顏色識別,並對向量表中的結果進行優化。想要輸出色彩需要專業技術分析識別,江蘇視圖專業的圖片處理技術可以完成,可以詳細了解。
3. asp或者js如何獲取在線圖片的主題色
我的思路是從圖片縮放到一個比較小的范圍,然後均勻的抽樣取各點的色值,然後取平均數或者取最接近的顏色。
我用js做過
4. 如何從js中獲取元素的顏色並改變
1、這個函數來自Rico,Longbill及Dnew.cn修改。
2、說明: 傳入參數一個,為元素的id值或元素本身,返回為元素的真實背景色值(字元串)。背景值均為16進制的值(原代碼是是IE裡面返回的是16進制的值,而Mozilla則是rgb值,Dnew.cn將其修改為均返回16進制的值)。
3、代碼如下:
<html>
<head>
<title>得到元素真實的背景顏色</title>
<style>
.classname{background-color:#ff99dd;}
#div3{background-color:#d8bfd8;}
div{background-color:#87cefa;border:1pxsolid#333333;margin:10px;padding:4px;}
body{background-color:#bed742;}
#div4{background-color:transparent;}
</style>
</head>
<body>
<spanstyle="text-align:center;font-size:20px;color:#ff7f50;width:100%;">得到元素真實的背景顏色<fontstyle="font-size:12px;">By<ahref=
<divid='div1'>div1直接通過div標簽定義背景色(#87cefa)</div>
<divid='div2'class=classname>div2通過classname定義背景色(#ff99dd)</div>
<divid='div3'>div3通過id定義背景色(#d8bfd8)</div>
<divid='div4'>div4這是一個透明的div,背景色應為上一個元素的顏色(#bed742)</div>
<buttononclick="go()">getBg()</button>
<script>
functiongetBg(element)
{//author:Longbill(
)
//dnew.cn修補
varrgbToHex=function(rgbarray,array){
if(rgbarray.length<3)returnfalse;
if(rgbarray.length==4&&rgbarray[3]==0&&!array)return'transparent';
varhex=[];
for(vari=0;i<3;i++){
varbit=(rgbarray[i]-0).toString(16);
hex.push((bit.length==1)?'0'+bit:bit);
}
returnarray?hex:'#'+hex.join('');
}
//---------------
if(typeofelement=="string")element=document.getElementById(element);
if(!element)return;
cssProperty="backgroundColor";
mozillaEquivalentCSS="background-color";
if(element.currentStyle)
varactualColor=element.currentStyle[cssProperty];
else
{
varcs=document.defaultView.getComputedStyle(element,null);
varactualColor=cs.getPropertyValue(mozillaEquivalentCSS).match(/d{1,3}/g);
//-----
actualColor=(actualColor)?rgbToHex(actualColor):"transparent";
}
if(actualColor=="transparent"&&element.parentNode)
returnarguments.callee(element.parentNode);
if(actualColor==null)
return"#ffffff";
else
returnactualColor;
}
functiongo()
{
for(vari=1;i<=4;i++)eval("alert('div"+i+":'+getBg('div"+i+"'));");
}
</script>
</body>
</html>
5. js 如何獲取背景色的值
javascript的style屬性只能獲取內聯樣式,對於外部樣式和嵌入式樣式需要用currentStyle屬性。但是,currentStyle在FIrefox和Chrome下不支持,需要使用如下兼容性代碼
HTMLElement.prototype.__defineGetter__("currentStyle",function(){
returnthis.ownerDocument.defaultView.getComputedStyle(this,null);
});
接下來就可以直接使用currentStyle屬性來獲取元素的樣式了,下面實例演示獲取頁面body的背景色:
1、HTML結構
<inputtype='button'value='點擊按鈕獲取頁面背景色'onclick="fun()"/>
2、CSS樣式
body{background:RGB(222,222,2);}
3、javascript代碼
HTMLElement.prototype.__defineGetter__("currentStyle",function(){
returnthis.ownerDocument.defaultView.getComputedStyle(this,null);
});
functionfun(){
varcolor=document.body.currentStyle.backgroundColor;
alert(color);
}
4、效果演示
6. javascript載入圖片查看具體某一點RGB值
必須瀏覽器要支持Canvas才可以。
html中需要有一個canvas
<canvasid="canvas">對不你,你的瀏覽器不支持Canvas</canvas>
js代碼:
varctxt=canvas.getContext('2d');
varimg=newImage;
img.onload=function(){
ctxt.drawImage(img,0,0);
vardata=ctxt.getImageData(0,0,img.width,img.height).data;//讀取整張圖片的像素。
console.log(data,data.toString());
}
img.src='img/pic.jpg';//src也可以是從文件選擇控制項中取得。
然後獲取像素的某點顏色值。
vardata=ctxt.getImageData(0,0,480,480).data;
for(vari=0,len=data.length;i<len;i+=4){
varred=data[i],//紅色色深
green=data[i+1],//綠色色深
blue=data[i+2],//藍色色深
alpha=data[i+3];//透明度
//因此RGB顏色就是(red,green,blue,alpha)
}
上面所說的img.src 是通過一個相對路徑比如「img/pic.jpg"指定的,但是如果你的相片不是在網路上,而是想用戶自己在本機上選擇的怎麼辦?其實也是可以的。
比如你有一個<input id="" type="file" />的上傳控制項selector,用戶選擇好文件以後。
你就可以取得這個selector.files這個對象列表了。
假定我們已經取得了這個files列表,並且files中只有一個合法的圖片文件。代碼如下:
varreader=newFileReader();
//綁定load事件自動回調函數
reader.onload=function(e){
varsrc=e.target.result;
//然後我們image.src就可以指向這個src了。
image.src=src;
//然後進行上面的各種處理。
};
//讀取文件內容
reader.readAsDataURL(files[0]);