color-picker:平面和简单的颜色选择器库。 没有依赖关系,没有jQuery

  • J8_526023
    了解作者
  • 12.9MB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • VIP专享
    资源类型
  • 0
    下载次数
  • 2022-06-15 03:33
    上传日期
扁平而简单的选色器 特征 简单:界面简单明了,易于使用。 实用:多种颜色表示。 多个主题。 适用于移动设备:在移动设备和触摸屏上效果很好。 没有依赖关系 主题 黑暗的 光 入门 注意:自述文件始终是最新的最新提交信息。 请参阅以获取有关最新版本的安装说明。 浏览器 < link rel =" stylesheet " href =" dist/color-picker.min.css "/> < script type =" text/javascript " src =" dist/color-picker.min.js " > </ script > 用法 // Simple example, see optional options for more configuration. const picker = new ColorPickerControl ( {
color-picker-main.zip
  • color-picker-main
  • assets
  • demo.gif
    13.7MB
  • light_theme.png
    19.7KB
  • dark_theme.png
    20.8KB
  • index.html
    3.2KB
  • LICENSE
    1KB
  • dist
  • color-picker.min.js
    31.6KB
  • color-picker.min.css
    8.9KB
  • src
  • css
  • color-picker.css
    10.9KB
  • js
  • color-picker.js
    98.1KB
  • st
  • reset.css
    1.1KB
  • styles.css
    10.7KB
  • script.js
    825B
  • EXAMPLES.md
    0B
  • README.md
    2.7KB
内容介绍
<h3 align="center"> Flat and simple color-picker </h3> <p align="center"> <img alt="gzip size" src="https://img.badgesize.io/ivanvmat/color-picker/master/dist/color-picker.min.js.svg?compression=gzip&style=flat-square"> <img alt="brotli size" src="https://img.badgesize.io/ivanvmat/color-picker/master/dist/color-picker.min.js?compression=brotli&style=flat-square"> <img alt="No dependencies" src="https://img.shields.io/badge/dependencies-none-27ae60.svg?style=popout-square"> <img alt="Current version" src="https://img.shields.io/github/tag/ivanvmat/color-picker.svg?color=3498DB&label=version&style=flat-square"> <a href="https://github.com/sponsors/ivanvmat" rel='nofollow' onclick='return false;'><img alt="Support me" src="https://img.shields.io/badge/github-support-3498DB.svg?style=popout-square"></a> </p> <br> <h3 align="center"> </h3> <h4 align="center"> <a href="https://ivanvmat.github.io/color-picker/" rel='nofollow' onclick='return false;'>Fully Featured demo</a> </h4> ### Features * Simple: The interface is straight forward and easy to use. * Practical: Multiple color representations. Multiple themes. * Mobile-friendly: Works well on mobile devices and touch screens. * No dependencies ### Themes |Dark|Light| |----|-----| |![Dark theme](assets/dark_theme.png)|![Light theme](assets/light_theme.png)| ### Getting Started > Note: The readme is always up-to-date with the latest commit. See [Releases](https://github.com/ivanvmat/color-picker/releases) for installation instructions regarding to the latest version. #### Browser ```html <link rel="stylesheet" href="dist/color-picker.min.css"/> <script type="text/javascript" src="dist/color-picker.min.js"></script> ``` ### Usage ```javascript // Simple example, see optional options for more configuration. const picker = new ColorPickerControl({ container: document.body, theme: 'dark' }); ``` > You can find more examples [here](EXAMPLES.md). ## Events Use the `on(event, cb)` and `off(event, cb)` functions to bind / unbind eventlistener. | Event | Description | Arguments | | -------------- | ----------- | --------- | | `init` | Initialization done - color picker can be used | `ColorPickerControlInstance` | | `open` | Color picker got opened | `ColorPickerControlInstance` | | `change` | Color has changed | `HSVaColorObject` | | `close` | Color picker got closed | `ColorPickerControlInstance` | > Example: ```js picker.on('init', (instance) => { console.log('Event: "init"', instance); }); picker.on('open', (instance) => { console.log('Event: "open"', instance); }); picker.on('change', (color) => { console.log('Event: "change"', color); }); picker.on('close', (instance) => { console.log('Event: "close"', instance); }); ```
评论
    相关推荐
    • fengshui.js:上下文 jQuery JavaScript
      风水 上下文 jQuery / JavaScript
    • jQuery JavaScript
      jQuery 是一个JavaScript 库,它有助于简化 JavaScript 以及 Asynchronous JavaScript + XML (Ajax) 编程。与类似的 JavaScript 库不同,jQuery 具有独特的基本原理,可以简洁地表示常见的复杂代码。学习
    • jQuery JavaScript库v3.4.1
      jQuery 是一个JavaScript 库,它有助于简化 JavaScript 以及 Asynchronous JavaScript + XML (Ajax) 编程。与类似的 JavaScript 库不同,jQuery 具有独特的基本原理,可以简洁地表示常见的复杂代码。学习
    • jquery-screwed:仅由六个不同字符组成的jQuery JavaScript库: ()+ []
      jQuery JavaScript库只用六个不同的角色提出: ! ( ) + [ ] 用法 您可以在代码中的任何位置(如常规jQuery)使用jQuery Screwed。 < script src =" jquery-3.5.1.screwed.js " > </ script > < ...
    • jQuery JavaScript与CSS开发入门经典
      jQueryJavaScript编程量精简为寥寥数行代码,使JavaScript变得更直观,更富魅力。iQuery还允许同时为一个或多个元素设置样式,使得通过JavaScript操纵CSS变得分外轻松。 在这本面向项目的精品书籍的指引下,即使是...
    • jQuery JavaScript
      jQuery 是一个JavaScript 库,它有助于简化 JavaScript™ 以及 Asynchronous JavaScript + XML (Ajax) 编程。与类似的 JavaScript 库不同,jQuery 具有独特的基本原理,可以简洁地表示常见的复杂代码。学习 jQuery ...
    • jquery javascript
      jquery javascript
    • 在线裁剪 JQuery javascript
      在线裁剪 JQuery javascript 绝对能用,绝对好用
    • jquery JavaScript css html
      jquery学习文档API JavaScript学习文档API css学习文档API html网页大全 学习文档API
    • jquery javascript .Net 图片截图
      jquery+javascript+.Net 图片截图 提供一个图片的地址,可以截取图片里的一部分。 使用jquery在页面上框选图片的范围 利用.Net处理图片并返回给页面截图的Url地址