Monday, June 25, 2007

Javascript to convert the reverse color value

Here is the small javascript code i wrote to get the reverse color for text on the colored background.


< script type="text/javascript">
function changeColor(colorval){
var colorValue='';
var reverseColor='';
if(colorval.length==4 || colorval.length==7 ){
colorval=colorval.substr(1,colorval.length);
}
if (colorval.length==3){
for(i=0;i<colorval.length;i++){
var colchar=colorval.substr(i,1);
colorValue+=colchar+colchar;
reverseColor+=reverseColorChar(colchar)+reverseColorChar(colchar);
}
}else{
for(j=0;j<colorval.length;j++){
var colchar=colorval.substr(j,1);
reverseColor += reverseColorChar(colchar);
}
colorValue=colorval;
}


document.getElementById('abc').style.background='#'+colorValue;
document.getElementById('abc_text').style.color='#'+reverseColor;
alert(reverseColor);
}

function reverseColorChar(colorChar){
var reverseColorCode=0;
if(colorChar=='0')
reverseColorCode='f';
else if(colorChar=='1')
reverseColorCode='e';
else if(colorChar=='2')
reverseColorCode='d';
else if(colorChar=='3')
reverseColorCode='c';
else if(colorChar=='4')
reverseColorCode='b';
else if(colorChar=='5')
reverseColorCode='a';
else if(colorChar=='6')
reverseColorCode='9';
else if(colorChar=='7')
reverseColorCode='8';
else if(colorChar=='8')
reverseColorCode='7';
else if(colorChar=='9')
reverseColorCode='6';
else if(colorChar=='a')
reverseColorCode='5';
else if(colorChar=='b')
reverseColorCode='4';
else if(colorChar=='c')
reverseColorCode='3';
else if(colorChar=='d')
reverseColorCode='2';
else if(colorChar=='e')
reverseColorCode='1';
else if(colorChar=='f')
reverseColorCode='0';
return reverseColorCode;
}


< /script>

< input type="text" id="colorValue" name="colorValue" value="">
< input type="button" value="change color" onclick="javascript:changeColor(document.getElementById('colorValue').value)">
< div id="abc" style="width:100px;height:100px;border:1px #333 solid;">
< span id="abc_text">here is the text< /div>
Javascript to convert the reverse color valueSocialTwist Tell-a-Friend

No comments: