图形是用canvas绘制的
js代码
var paras = {
max:800,
min:100,
skin:'tron',//button type
thickness:.3,//button width
width:'200',//define canvas width.,canvas height
displayInput:'true',
//value:200,input得默认值 不能再这里设置
fgcolor:'#6391B2',//effective value that u can see
bgcolor:'blue', //bgcolor
'release':function(e){
$('#img').animate({width:e,opacity:0.5},5000,callback);
}//松开时的处理函数e为input的值
定义knob的方法 用json法
再用 $(绑定的input元素).knob(paras);
注意paras中的属性假如在input中定义时,要加上data-*
for exp
data-width="150" data-fgColor="green" data-bgColor="red" data-skin="tron" data-thickness=".3" data-min="200" data-max="600"
分享到:
相关推荐
AutoCompleteComboBox DropDownList BoundToolTip UIWindowBase UI_Knob TextPic InputFocus Box Slider CooldownButton Segmented Control Stepper Primitives UILineRenderer UILineTextureRenderer UICircle ...
50. **jQuery Knob**:可旋转的数字输入插件,适用于滑动调整设置。 以上这些jQuery插件覆盖了网站设计和开发的各个层面,无论你是要创建交互式表单、美化页面元素,还是实现动态效果,都可以找到合适的工具。持续...
使用jquery.knob.js的步骤相对简单。首先,你需要在HTML文件中引入jQuery、jQuery UI和jquery.knob.js的脚本文件。接着,为需要变成旋转按钮的元素添加特定的类名,并通过jQuery选择器选中这些元素。然后,调用`....
在本插件中,jQuery主要负责旋钮的旋转控制,通过监听用户的触摸或鼠标事件,改变音量值,并实时更新UI显示。 CSS3是层叠样式表的最新版本,引入了许多新的特性和功能,如选择器、边框与背景、过渡、动画等。在这款...
网页图标全采用FontAwesome,除Bootstrap,jQuery UI使用到的第三方插件有: jQuery 2.0.3 jQuery UI 1.10.3 (Custom Build) Twitter Bootstrap 3.0.0 FontAwesome 3.2.1 Google "Open Sans" Font jQuery Flot ...
1. **使用帮助.txt** - 这个文本文件可能包含了关于如何安装、配置和使用`jquery.knob.js`插件的详细步骤和示例代码。 2. **谷普下载.url** - 这是一个链接,指向可能包含更多资源、更新或用户社区的下载页面,方便...
网页图标全采用FontAwesome,除Bootstrap,jQuery UI使用到的第三方插件有: jQuery 2.0.3 jQuery UI 1.10.3 (Custom Build) Twitter Bootstrap 3.0.0 FontAwesome 3.2.1 Google "Open Sans" Font jQuery Flot ...
【Unity Steam_VR 开发工具插件 VRTK 自带案例分析】 在Unity中开发VR应用时,VRTK(Virtual Reality Toolkit)是一个强大的工具包,它提供了许多预设的场景和脚本来帮助开发者快速实现VR交互功能。在“VRTK自带...
- `jquery-ui.custom.js`:包含了定制的jQuery UI插件。 - `jquery-ui.js`:完整版的jQuery UI库。 - `html5shiv.js & respond.js`:用于IE8及以下浏览器的HTML5兼容性支持。 3. **JS 引入顺序**: - 首先引入...
10. **UI Bootstrap**: 基于Bootstrap框架的jQuery UI组件,提供一套统一的界面元素和交互效果。 11. **Stylish Accordion**: 优雅的折叠面板,节省空间的同时保持内容的清晰组织。 12. **On-demand Search Box**: ...