哎,前段開發真心不容易。 。 。 。弄了1小時,找了各種素材,終於,字體選色板基本功能弄好了,UI設計技能亟待提升。先看效果: 功能介紹:點選顏色按鈕,彈出選色板,選取一個顏色,儲存設置,隱藏選色板。 。 。實作原始碼如下: 複製程式碼 程式碼如下: color name="fontColor" type="button" value="颜色" onclick="coloropen(event)" id="fontColor" /> <br> <!--<br> var ColorHex = new Array('00', '33', '66', '99', 'CC', 'FF')<br> var SpColorHex = new Array('FF0000', '00FF00', '0000FF', 'FFFF00',<br> '00FFFF', 'FF00FF')<br> var current = null<br> function initcolor() {<br> getArgs();</p> <p> //chat.js init();<br> init();</p> <p> var colorTable = ''<br> for (i = 0; i for (j = 0; j '<br> colorTable = colorTable<br> '</p> <td width="15" style="background-color:#000000">'<br> '</td> <td width="15" style="cursor:pointer;background-color:#'<BR> ColorHex[ ColorHex[j]<BR> '" onclick=" doclick(this.style.backgroundColor)">'<br> } else {<br> colorTable = colorTable<br> SpColorHex[ j]<br> '" onclick="doclick(this.style.backgroundColor)">'<br> }<br> 00000" >'<br> for (k = 0; k for (l = 0; l > '" onclick="doclick(this.style.backgroundColor)">'<br> }<br> }<c order="0" cellspacing="“0" bordercolor="000000">'<br> '<tr height="20"> <br> '</tr> <tr height="20"> <td colspan="21" bgcolor="#ffffff" style="font:12px tahoma;padding-left:2px;">'<br> '<span style="float:left;color:#999999;">12</span>' <br> '<span style="float:right;padding-right:3px;cursor:pointer;" onclick="colorclose()">×關閉</span>'<br> table '</td>×關閉'<br> table ' >'<br> '<table border="1" cellspacing="0" cellpadding="0" style="border-collapse:collapse" bordercolor="000000">'<br> colorTable '</table>';<br> document.getElementById("colorpane ").innerHTML = colorTable;<br> var current_x = document.getElement ("fontColor").offsetTop;<br> //alert(current_x " -" current_y) <br> document.getElementById("colorpane").style.left = current_x "px"; colorpane").style.top = current_y "px";<br> } <br> function doclick(obj) {<br> //document.getElementById("fontor").. ("colorpane").style.display = "none";<br> document.getElementById('msgbox').style.color = obj;<br> //alert(obj);<br> //var chatArea = frame["chat"].document<br> // .getElementsByName('chatArea');<br> //for ( var i = 0;我 //}<br> }<br> function colorclose() {<br> document.getElementById("colorcolore"). //警報(「好的」); <br> }<br> function coloropen() {<br> document.getElementById("colorpane").style.display = "";<br> ><br> </tr></c> </td> </div>