<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>纯JavaScript实现简洁的颜色选取器</title> <script src="colorpicker.js"></script> <style> * { margin: 0; padding: 0; } .picker { width: 300px; height: 20px; cursor: pointer; position: absolute; left: 40px; top: 40px; color: #fff; } </style> </head> <body > <div class="abc"> <div class="picker" id="color-picker" style="position: relative;left: 200px;top: 200px;"> 请选择颜色</div> </div> <script type="text/javascript"> var obj = document.getElementById("picker"); var a = Colorpicker.create({ el: "color-picker", color: "#000fff", change: function (elem, hex) { elem.style.backgroundColor = hex; } }) </script> </body> </html>
纯JavaScript实现简洁的颜色选取器
标签:
评论者:[[ schemeInfo.user.username ]]
评论内容:[[ schemeInfo.pbody ]]
评论时间:[[ schemeInfo.ptime ]]
发表你的评论:
提交评论
下一篇:
CSS3 水墨风格背景动画按钮