NO.145 ドキュメント応用⑤

背景色を特定の色(4096色)へフェードイン

こういうの作ってると頭がこんがらがってきます。数学苦手；；
どうしても計算が合わないのですが、なぜか意図した動作になったのでこのまま公開します。
一応R16*G16*B16で合計4096色の中からどれでもクリックするだけで背景色をフェードさせる事が出来ます。
※2006/01/20 正常に動作するよう訂正しました

実行例

ソース

<style type=text/css>
<!--
.tl{font-size:10px;}
-->
</style>
<script type=text/javascript>
<!--
function CHA(iro){
R1=parseInt(document.bgColor.substr(1,2),16);
G1=parseInt(document.bgColor.substr(3,2),16);
B1=parseInt(document.bgColor.substr(5.2),16);
R2=parseInt(iro.substr(1,2),16);
G2=parseInt(iro.substr(3,2),16);
B2=parseInt(iro.substr(5.2),16);
R3=R1;G3=G1;B3=B1;
for(p=0;p<16;p++){
if(R1<R2){R3=(R3+Math.floor((R2-R1)/16));}
if(R2<R1){R3=(R3-Math.floor((R1-R2)/16));}
if(G1<G2){G3=(G3+Math.floor((G2-G1)/16));}
if(G2<G1){G3=(G3-Math.floor((G1-G2)/16));}
if(B1<B2){B3=(B3+Math.floor((B2-B1)/16));}
if(B2<B1){B3=(B3-Math.floor((B1-B2)/16));}
D1=R3.toString(16);D2=G3.toString(16);D3=B3.toString(16);
if(R3<16){D1=0+D1}if(G3<16){D2=0+D2}if(B3<16){D3=0+D3}
document.bgColor="#"+D1+D2+D3;
}
document.bgColor=iro;
}
CL=new Array("00","11","22","33","44","55","66","77","88","99","aa","bb","cc","dd","ee","ff");
document.write("<table border=0 class=tl>");
for(c=0;c<16;c++){
for(b=0;b<16;b++){
document.write("<tr>");
for(a=0;a<16;a++){document.write("<td onclick='CHA(this.bgColor)'bgcolor=#"+CL[c]+CL[b]+CL[a]+">#"+CL[c]+CL[b]+CL[a]+"</td>");}
document.write("</tr>");
}}
document.write("</table>");
-->
</script>

※parseInt(数値,A)⇒A進数を10進数に変換、 substr(A,B)⇒(A-1)番目の文字からB文字を抜き出す、
Math.floor(A)⇒Aの小数点以下を切り捨てる、 A=数値.toString(B)⇒数値をB進数に変換してAに格納する

実行

トップに戻る前に戻る　次に進む

SEO		[PR] 爆速!無料ブログ無料ホームページ開設無料ライブ放送