项目中需要从页面选择颜色定制背景色,google了一个样例,但其html代码太大所以自己写了一段js替之。
觉得还是比较有用的一段小代码,希望可以帮到一些朋友。
[code]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>the color</title>
<script>
var Color = {
outprint: function() {
var s='',i=0,cc = this.getCC();
for(var b=1;b<=56;b+=11){
for(var a=1;a<=281;a+=8){s+=this.getArea(a,b,a+6,b+9,cc[i++]);}
}
document.write(s);
},
getCC: function() {
var c=['00','33','66','99','cc','ff'],cc=[];
for(var j=c.length;j>0;j--){
var ccm=c[j-1];
for(var i=0;i<c.length;i++){
var ccl=c[i];
for(var l=0;l<c.length;l++){cc[cc.length]=ccl+ccm+c[l];}
}
}
return cc;
},
getArea: function(a,b,c,d,cc) {
return '<area shape="rect" coords='+a+','+b+','+c+','+d+
' href="javascript:Color.theColor(\'#'+cc+'\')"/>';
},
theColor: function(cvalue) {
//to do
//alert(cvalue);
document.getElementById('theColor').style.color=cvalue;
}
}
</script>
</head>
<body>
<span id="color_selection" style="display:;">
<img height="67" src="palette.gif" width="289" useMap="#spmap" border="0"/>
</span>
<map name="spmap"><script>Color.outprint();</script></map>
<span id="theColor" name="theColor" style="color:#000000;">THE COLOR</span>
</body>
</html>[/code]
觉得还是比较有用的一段小代码,希望可以帮到一些朋友。
[code]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>the color</title>
<script>
var Color = {
outprint: function() {
var s='',i=0,cc = this.getCC();
for(var b=1;b<=56;b+=11){
for(var a=1;a<=281;a+=8){s+=this.getArea(a,b,a+6,b+9,cc[i++]);}
}
document.write(s);
},
getCC: function() {
var c=['00','33','66','99','cc','ff'],cc=[];
for(var j=c.length;j>0;j--){
var ccm=c[j-1];
for(var i=0;i<c.length;i++){
var ccl=c[i];
for(var l=0;l<c.length;l++){cc[cc.length]=ccl+ccm+c[l];}
}
}
return cc;
},
getArea: function(a,b,c,d,cc) {
return '<area shape="rect" coords='+a+','+b+','+c+','+d+
' href="javascript:Color.theColor(\'#'+cc+'\')"/>';
},
theColor: function(cvalue) {
//to do
//alert(cvalue);
document.getElementById('theColor').style.color=cvalue;
}
}
</script>
</head>
<body>
<span id="color_selection" style="display:;">
<img height="67" src="palette.gif" width="289" useMap="#spmap" border="0"/>
</span>
<map name="spmap"><script>Color.outprint();</script></map>
<span id="theColor" name="theColor" style="color:#000000;">THE COLOR</span>
</body>
</html>[/code]