Web Component: j-TimePicker


  • Info
  • HTML
  • JS
  • CSS
  • Meta
Questions? Write us

j-TimePicker

  • supports dark mode

Configuration:

  • seconds {Boolean} optional, enables seconds (default: false)
  • ampm {Boolean} optional, enables 12 hours time format (default: false)

The component must be called manually or works with j-Input component automatically. This component is a singleton.

  • important add the component under <body> element

Usage

var opt = {};

// opt.offsetX {Number}    : adds X offset (default: 0)
// opt.offsetY {Number}    : adds Y offset (default: 0)
// opt.seconds {Boolean}   : shows seconds (default: false)
// opt.ampm    {Boolean}   : shows 12 hours time format (default: false)
// opt.align   {left|center|right} (default: left)

opt.value = new Date();
// or
// opt.value = 'path.to.date' (in this case you don't need to declare "opt.callback")

opt.element = YOUR_ELEMENT;

opt.callback = function(date) {
    console.log(date);
};

// opt.close {Function} optional, this function can determine the closing of TimePicker

SETTER('timepicker', 'show', opt);

Author

Real-time preview

Refresh previewDownload HTMLSource-Code on GitHub