Usage
To use this plug in, call the ptTimeSelect() method to add the link next to
each matched element.
$('').ptTimeSelect({opt});
PARAMS
- {opt} - {OBJECT} (Optional) Object with custom options for the selected
elements.
The following options can be defined inside an object and passed as the first
argument to the method above:
| bgcolor |
The background color for the popup. NOTE... This value will be ignored if a
cntr_class is set.
|
| border_color |
The color to be associated with elements that
display a border. NOTE... This value will be ignored if a
cntr_class is set.
|
| labels |
Object ({}) with the label definitions below.
|
| labels.x |
The value to be used inside of the popup close
link. This can also be an image (<img>). Default
is [Close]
|
| labels.popup_link |
The text to be used inside of the link
created next to the imput field. This can also be
an image (<img>). Default is [T]
|
| labels.set_time |
The text to be used inside of the link at the
bottom of the popup, that sets the time defined
back to the input field. This value can also be
an image. Default is SET
|
| cntr_width |
The width of the entire container that holds the
time definition element.
|
| cntr_class |
Class to be associated with the entire container
of the popup area. This is a <div> element that
contains a table and the set button. When this class is set
the bgcolor, border_color and cntr_width are ignored.
|
|
Demo
Example 1
Default call with no params defined. [ view source]
$('#sample1>input').ptTimeSelect();
Example 2
Call with customized colors. [ view source]
$('#sample2>input').ptTimeSelect({
labels: {
x: '[X]',
popup_link: '[Pick Time]',
set_time: 'Set New Time'
},
bgcolor: '#fff',
border_color: '#ff0000'
});
Example 3
Call with customized class by the name of timeCntr. To view the definition of this class, do a view source on this page.
[ view source]
$('#sample3>input').ptTimeSelect({
labels: {
x: '[close this]',
popup_link: '[Time]',
set_time: 'save it'
},
cntr_class: 'timeCntr'
});
|