颜色选择器jQuery MiniColors

所属分类:输入-拾色器

 63449  335  查看评论 (3)
分享到微信朋友圈
X
颜色选择器jQuery MiniColors ie兼容7

颜色选择器jQuery MiniColors

使用步骤

实例像任何jQuery插件:

$('INPUT.minicolors').minicolors(settings);

默认的设置如下:

$.minicolors = {
	defaults: {
		animationSpeed: 50,
		animationEasing: 'swing',
		change: null,
		changeDelay: 0,
		control: 'hue',
		defaultValue: '',
		hide: null,
		hideSpeed: 100,
		inline: false,
		letterCase: 'lowercase',
		opacity: false,
		position: 'bottom left',
		show: null,
		showSpeed: 100,
		theme: 'default'
	}
};


为方便起见,您可以通过分配新值全局更改默认设置:

$.minicolors.defaults = $.extend($.minicolors.defaults, {
	changeDelay: 200,
	letterCase: 'uppercase',
	theme: 'bootstrap'
});

注:更改默认设置将不会影响已经初始化控件。


animationSpeed

当用户点击或点击一个新的颜色滑块的动画速度。设置为 0为没有动画。


animationEasing

缓动动画滑杆时使用。


changeDelay

的时间,以毫秒为单位,推迟了变化,而 用户进行选择的射击事件。这是为了防止有用变化的事件频繁发射作为用户拖动周围的颜色选择器。


缺省值是0(无延迟)。如果你改变的回调功能的东西资源密集型(如AJAX请求),你可能会想将它设置为至少200。


控制

确定控制的种类。有效的选项为色调,亮度, 饱和度,和车轮。


设置defaultValue

要强制默认的颜色,设置为一个有效的十六进制字符串。当用户清除了控制,它会恢复到这种颜色。


hideSpeed&showSpeed

的速度来隐藏和显示的颜色选择器。


内联

设置为真给力拾色器出现内联。


大小写

确定的十六进制代码值的字母大小写。有效选项为大写 或小写。


不透明度

设置为真,使不透明度滑块。(使用输入单元的 数据不透明度属性来设置一个预先设定的值。)


位置

设置下拉列表的位置。有效的选项为bottom left, bottom right, top left, and top right.


相关插件-拾色器

js拾色器插件colorpicker.js

原生JS实现的拾色器
  拾色器
 35310  242

jQuery拾色器插件bigcolorpicker

颜色拾取器(又名取色板)是为了方便用户在一些需要使用颜色的WEB应用中直观的选择所需的颜色,如论坛发帖时使用的编辑器中就应用到了颜色拾取器。本文将给大家介绍一款非常好用的基于jQuery的颜色拾取器,它可以轻松便捷的应用到你的项目中去。
  拾色器
 52704  339

适合移动设备的小巧jQuery颜色拾取器

tinyColPicker是一款适合移动设备的小巧jQuery颜色拾取器。该jQuery颜色拾取器以移动手机为优先对象,它具有速度快、可扩展、高度灵活和可插拔等特点。该jQuery颜色拾取器大小仅4.7K,纯js,不需要图片和css代码。它基于cols.js制作而成,支持所有现代特性,如触摸屏和MS pointer。它使用GPU加速,使用requestanimationframe函数时电池工作时间更长
  拾色器
 31221  293
  拾色器
 30235  296

讨论这个项目(3)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    My hero 0
    2019/4/9 10:53:28
    怎么把选择的颜色赋值给文字 回复
    Hunk 0
    2018/8/22 11:13:17
    用JS改变input的值的时候前面的颜色块不会变,能解决下么 回复
    跟猫恋爱老鼠 0
    2016/3/19 10:03:45
    看起来很高大上 回复
    魔界小鸟 0
    2014/7/16 20:24:00

    查看下demo和aip中的方法哦。

    回复
    插件王子 0
    2014/7/15 19:47:00

    怎么用啊。写个元素点击什么的用法咯,跟这个一样,为什么我的没有效果啊

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复