HTML5Canvas颜色选择器..docVIP

HTML5 Canvas 颜色选择器 这段代码是用HTML5来创建一个网页颜色选择器。首先在Canvas画一幅图，然后添加鼠标事件 “鼠标移动”，“鼠标点击”。在鼠标移动的时候，显示当前划过的颜色预览，在鼠标点击的时候，选中当前颜色，显示颜色的细节。 DEMO： /uploads/demo/example158/ [代码] [HTML]代码 !DOCTYPE html html lang=en head meta charset=utf-8 / titleA title=HTML5 href=/HTML5/A canvas - Image color picker | Script Tutorials/title link href=A title=css href=/css3css/A/main.A title=css href=/css3css/A rel=stylesheet type=text/css / script type=text/A title=javascript href=/javascriptjavascript/A src=js/jquery-1.5.2.min.js/script script type=text/A title=javascript href=/javascriptjavascript/A src=js/script.js/script /head body div class=container div class=column1 canvas id=panel width=500 height=333/canvas /div div class=column2 divinput type=button value=Next image id=swImage //div divPreview:/div div id=preview/div divColor:/div divR: input type=text id=rVal //div divG: input type=text id=gVal //div divB: input type=text id=bVal //div divRGB: input type=text id=rgbVal //div divRGBA: input type=text id=rgbaVal //div divHEX: input type=text id=hexVal //div hr / /div div style=clear:both;/div /div footer h2HTML5 canvas - Image color picker/h2 a href=/html5-canvas-image-color-picker/ class=stutsBack to original tutorial on spanScript Tutorials/span/a /footer /body /html [CSS]代码 *{ margin:0; padding:0; } body { background-color:#bababa; color:#fff; font:14px/1.3 Arial,sans-serif; } footer { background-color:#212121; bottom:0; box-shadow: 0 -1px 2px #111111; display:block; height:70px; left:0; position:fixed; width:100%; z-index:100; } footer h2{ font-size: