ClockPicker.js是一款时钟插件,其实还可以改进,里面的分可以改成短横线。

在线实例

实例预览  jQuery ClockPicker 圆形时钟

使用方法

  1. <div class="input-group clockpicker">
  2. <input type="text" class="form-control" value="09:30">
  3. <span class="input-group-addon">
  4. <span class="glyphicon glyphicon-time"></span>
  5. </span>
  6. </div>
  7. $('.clockpicker').clockpicker();
复制

参数详解

参数 描述 默认值
default 默认时间, 'now' 或'13:14' -
placement 提示位置 'left'、'right'、'top' bottom
align 提示箭头位置 left
donetext 完成按钮文本 完成
autoclose 是否自动关闭 false
vibrate 当鼠标拖动显示摇摆效果 true
fromnow 设置从现在开始now 0

ClockPicker调用方法

show 显示 -
hide 隐藏 -
remove 移除 -
toggleView 切换显示 'hours' 或 'minutes' -

jQuery ClockPicker 圆形时钟的更多相关文章

  1. jq动画插件,自制基于vue的圆形时钟

    首先附上jq插件库,里面的东西太炫了,建议学前端的可以看看学习下:http://www.jq22.com/ 里面有个“超个性动画版本的个人简历”,通过屏幕上不断打印内容,改变相应样式来实现动画简历,我 ...

  2. jquery模拟LCD 时钟

    查看效果网址:http://keleyi.com/keleyi/phtml/jqtexiao/24.htm 以下是HTML文件源代码: <!DOCTYPE html PUBLIC "- ...

  3. canvas自适应圆形时钟绘制

    前面的话 前面介绍过canvas粒子时钟的绘制,本文将详细介绍canvas自适应圆形时钟绘制 效果演示 最终自适应圆形时钟的效果如下所示 功能分析 下面来分析一下该圆形时钟的功能 [1]静态背景 对于 ...

  4. js绘制圆形时钟

    纯js制作圆形时钟 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  5. 分享一款基于jquery的圆形动画按钮

    之前为大家介绍过一款纯css3实现的圆形旋转分享按钮.今天要给大家带来一款基于jquery的圆形动画按钮.这款按钮鼠标经过的时候以边框转圈,然后逐渐消息,在实例中给出了四种颜色的demo.效果图如下: ...

  6. C#绘制圆形时钟

    本文由作者参考部分案例后加以修改完成: 参考链接如下: http://blog.csdn.net/xuemoyao/article/details/8001113 http://wenku.baidu ...

  7. JS框架_(JQuery.js)圆形多选菜单选项

    百度云盘 传送门 密码:zb1c 圆形多选菜单选项效果: <!DOCTYPE html> <html lang="en" > <head> &l ...

  8. jQuery实现数字时钟

    运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...

  9. CSS3 圆形时钟式网页进度条

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. The currently selected variant "arm-debug" uses split APKs, but none of the 1 split apks are compatible with the current device with density "213" and ABIs "x86".

    出现这种错误一般是在电脑上用模拟器运行APK的吧. 可以在build.gradle中这样配置下: android{ ... defaultConfig { applicationId "XX ...

  2. WaitType:ASYNC_IO_COMPLETION

    项目组有一个数据库备份的Job运行异常,该Job将备份数据存储到remote server上,平时5个小时就能完成的备份操作,现在运行19个小时还没有完成,backup命令的Wait type是 AS ...

  3. Constraint5:unique 约束和null

    unique约束使用unique index来限制列值的唯一性: 创建unique约束之后,column中允许插入null值,unique 约束将两个null值看作是相同的(即null=null为tr ...

  4. JAVA实现发送电子邮件

    相信大家对于网站也好,手机app也好,用户注册时,需要进行邮箱验证的功能特别好奇吧,本篇我将带领大家一起实现一下这个简单而又神奇的小功能,让我们的应用也可以加入这些神奇的元素.废话不多说,下面开始我们 ...

  5. multipart数据结构

    --[boundary]\r\n [headers]\r\n \r\n [content]\r\n --[boundary]\r\n [headers]\r\n \r\n [content]\r\n ...

  6. c# 实现简单的socket通信

    服务端 using System.Net.Sockets; using System.Net; using System.Threading; namespace SocketServer { cla ...

  7. C# 原样复制excel工作表

    在excel中,工作表是工作薄的组成部分,一个工作薄可以由一个或多个工作表组成,一个工作薄也可以说是一个excel文档,正因为如此,excel工作表的复制也就分为两种类型:在同一文档之内复制和在不同文 ...

  8. 前端自动化构建工具gulp的使用总结

    前端自动化构建工具gulp的使用总结 博主最近偶的空闲,在此对gulp的使用做一个总结,让小伙伴知道如何合理的使用gulp以及gulp的使用技巧. 谈到gulp,有人可能就会想到另外一个构建工具gru ...

  9. WebLogic12.1.1中跨域问题的探讨以及几种常见中间件中跨域问题的解决方法

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.问题描述 扬州现场中最开始安装了中间件WebLogic12.1.1 ...

  10. jQuery打造智能提示插件

    插件根据实际需要在单功能上封装的,实现传入后台数据地址,要保存值的input,前台要传入的参数(过滤条件),来返回下拉提示数据,数据过多可上下滚动选择,选择后显示文本与对应的值,供后台操作,如图: j ...