10;t(n,function(n){for(var t={},e="",r=[],i=0;i<n.length;i+=4)r[0]=n[i],r[1]=n[i+1],r[2]=n[i+2],e=r.join(","),-1===r.indexOf(void 0)&&0!==n[i+3]&&-1===a.indexOf(s(e))&&(t[e]=e in t?t[e]+1:1);if(u.success){var o=function(n,t){if(n.length>t)return n.slice(0,t);for(var e=n.length-1;e<t-1;e++)n.push(f("0,0,0",0));return n}(function(n){var t=[];for(var e in n)t.push(f(e,n[e]));return t.sort(function(n,t){return t.count-n.count}),t}(t),c+1);u.success({dominant:o[0].name,secondary:o[1].name,palette:o.map(function(n){return n.name}).slice(1)})}})},n});
具体html和js的使用代码是:
<html>
<head>
<meta charset="UTF-8">
<title>获取图片主题色脚本扩展的完整的示例</title>
<script src="./rgbaster.js"></script>
</head>
<body>
<div id="box" style="width:500px;height: 500px;">
<img src="mm4.jpg" alt="" id="image">
</div>
<script type="text/javascript">
var img = document.getElementById('image');
var box=document.getElementById('box');
RGBaster.colors(img, {
// return up to 30 top colors from the palette 从调色板返回最多30个顶级颜色
paletteSize: 30,
// don't count white
//排除 白色
exclude: ['rgb(255,255,255)'],
// do something when done
//获取成功之后
success: function(payload) {
box.style.background=payload.dominant;
console.log('Dominant color:', payload.dominant);
console.log('Secondary color:', payload.secondary);
console.log('Palette:', payload.palette);
}
})
</script>
</body>
</html>剩下的,效果一出,大家一目了然,就是这么简单。
以上就是如何使用javascript获取图片主体背景色(代码)的详细内容,更多请关注php中文网其它相关文章!
网站建设是一个广义的术语,涵盖了许多不同的技能和学科中所使用的生产和维护的网站。
关键词:如何运用javascript取得图片主体背景色(代码)