- ベストアンサー
webでの色のカスタマイズについて
ASPのスケジュラーのようなツールを開発してます。 Webから画面の色のカスタマイズをしたいと思っていますが、ドリームウィーバーにあるような、色を変えたい場所のプロパティーを選択するとカラーパレットが選ばれて、 色を選択できるように、ブラウザー上でできるようにするよい方法を教えていただけますでしょうか。 よろしくお願いいたします。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
お望みのものとはちょっと違うかもしれませんが カラーピッカーのようなものを使用したカラーサンプル 表示システムを知ってるのでご紹介します。(Javascript) いくらか参考になるでしょうか。
- 参考URL：
- http://www.zspc.com/color/
その他の回答 (1)
- basil
- ベストアンサー率35% (148/420)
私が昔つくったJavaScriptのソースを貼って置きます。 参考にしてください。 <html> <head> <title>HTML COLOR</title> <script Language="JavaScript"> <!-- function D1(){ i = document.test.in12.value; if (i==''){document.test.in12.value=clipnum;}else{ a = eval(i);b = a.toString(16); document.test.in13.value=b; colortest(); }} function D2(){ i = document.test.in22.value; if (i==''){document.test.in22.value=clipnum;}else{ a = eval(i);b = a.toString(16); document.test.in23.value=b; colortest(); }} function D3(){ i = document.test.in32.value; if (i==''){document.test.in32.value=clipnum;}else{ a = eval(i);b = a.toString(16); document.test.in33.value=b; colortest(); }} function H1(){ i = document.test.in13.value; if (i==''){document.test.in13.value=clipnum;}else{ a = eval("0x"+i);b = a.toString(10); document.test.in12.value=b; colortest(); }} function H2(){ i = document.test.in23.value; if (i==''){document.test.in23.value=clipnum;}else{ a = eval("0x"+i);b = a.toString(10); document.test.in22.value=b; colortest(); }} function H3(){ i = document.test.in33.value; if (i==''){document.test.in33.value=clipnum;}else{ a = eval("0x"+i);b = a.toString(10); document.test.in32.value=b; colortest(); }} function cl12(){clipnum=document.test.in12.value;document.test.in12.value='';} function cl22(){clipnum=document.test.in22.value;document.test.in22.value='';} function cl32(){clipnum=document.test.in32.value;document.test.in32.value='';} function cl13(){clipnum=document.test.in13.value;document.test.in13.value='';} function cl23(){clipnum=document.test.in23.value;document.test.in23.value='';} function cl33(){clipnum=document.test.in33.value;document.test.in33.value='';} function colortest(){ colornum(); wx=screenX; wy=screenY+window.outerHeight; colorwp = "width=200,height=100,dependent,alwaysRaised,screenx="+wx+",screenY="+wy; color = window.open("","colortest",colorwp); color.document.open(); color.document.write("<html><head>"); color.document.write("<title>#",bgc,"</title></head>\n"); color.document.write("<body bgcolor=#",bgc," "); color.document.write("onLoad=\"setTimeout(\'window.close(self)\',60000);\">\n"); color.document.write("<table width=99% height=99%><tr><td align=center>\n"); color.document.write("<font size=6 color=white face=Charcoal>",bgc,"</font><br>\n"); color.document.write("<font size=6 color=black face=Charcoal>",bgc,"</font><br>\n"); color.document.write("</td></tr></table>\n"); color.document.write("</body></html>\n"); color.document.close(); fin(); } function colornum(){ bgc1=eval(document.test.in12.value);if (bgc1<16){tt1="0"+bgc1.toString(16);}else{tt1=bgc1.toString(16);} bgc2=eval(document.test.in22.value);if (bgc2<16){tt2="0"+bgc2.toString(16);}else{tt2=bgc2.toString(16);} bgc3=eval(document.test.in32.value);if (bgc3<16){tt3="0"+bgc3.toString(16);}else{tt3=bgc3.toString(16);} bgc = tt1+tt2+tt3; } function fin(){ colornum(); document.test.in99.value="#"+bgc; } function bodyset(){ window.resizeTo(200,230); window.scrollbars=false; window.personalbars=false; window.statusbars=false; window.toolbars=false; window.menubars=false; window.locationbars=false; } --> </script> </head> <body bgcolor=#888888 onLoad="bodyset()"> <div align=center> <font size=4> HTML Color<br> <big>HEX - DEC</big><br> Converter<br> </font> <form name=test> <table border=0 cellpadding=2 cellspacing=5 bgcolor=#999999><tr><td> <table border=0 cellpadding=0 cellspacing=0 bgcolor=#aaaaaa> <tr align=center><td> </td><td>R</td><td>G</td><td>B</td><td> </td></tr> <tr> <td><font size=5 color=#FFFFFF>DEC</font></td> <td><input value=128 type=text name=in12 size=3 onFocus="cl12()" onBlur="D1()"></td> <td><input value=128 type=text name=in22 size=3 onFocus="cl22()" onBlur="D2()"></td> <td><input value=128 type=text name=in32 size=3 onFocus="cl32()" onBlur="D3()"></td> <td><font size=5 color=#FFFFFF> 10</font></td> </tr><tr> <td><font size=5 color=#FFFFFF>HEX</font></td> <td><input value=80 type=text name=in13 size=3 onFocus="cl13()" onBlur="H1()"></td> <td><input value=80 type=text name=in23 size=3 onFocus="cl23()" onBlur="H2()"></td> <td><input value=80 type=text name=in33 size=3 onFocus="cl33()" onBlur="H3()"></td> <td><font size=5 color=#FFFFFF> 16</font></td> </tr><tr><td colspan=5> </td></tr> </table> </td></tr></table> <br> <input type=text name=in99 size=7 value=#808080> <input type=button value="Preview" onClick="colortest()"><br> </form> JavaScript by Basil.<br> 1999.11.29 </div> </body> </html>
お礼
すばやいご回答ありがとうございます。 しかもソースまで。感謝です。
補足
ありがとうございます。 カラーピッカーから色を選択できるようにする ことはできませんでしょうか。 よろしくお願いいたします。
お礼
ありがとうございます。これです。近いです。 参考になります！！ 本当にありがとうございます。