You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+37-2Lines changed: 37 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,6 +2,7 @@ Turns a given dom element into a dynamic clock that updates every second, main a
2
2
```JavaScript
3
3
$.clock.version; //will return the current version number, so you can be sure which version of the script you are using
4
4
$.clock.options; //will return all possible options that can be passed to the jQuery clock plugin, with type description and accepted values
5
+
$.clock.methods; //will return all possible methods that are exposed by the plugin
5
6
```
6
7
7
8
# DEMOS
@@ -212,12 +213,42 @@ See an example of this in action here: **https://www.johnromanodorazio.com/jQuer
212
213
213
214
It is also possible to use a timestamp from an NTP timeserver and start the clock with the ntp's timestamp, in order to have precise atomic time. An example of this can be found here: **https://www.johnromanodorazio.com/ntptest.php**. In the example the ntp timestamp is adjusted on the server to reflect the Europe/London timezone.
214
215
215
-
## Destroy handler
216
+
## Destroy, start and stop handlers
216
217
217
-
Includes a handler so that each clock can be stopped, just pass "destroy".
218
+
*Includes a handler so that each clock can be destroyed, just pass "destroy". This will effectively remove the html markup, data, and setTimeout which keeps the clock ticking.
218
219
```JavaScript
219
220
$("div#clock").clock("destroy");
220
221
```
222
+
* Includes a handler so that each clock can be stopped, just pass "stop". This will remove only the setTimeout which keeps the clock ticking, not the html markup or the data, allowing the clock to start ticking again in a later moment.
223
+
```JavaScript
224
+
$("div#clock").clock("stop");
225
+
```
226
+
* Includes a handler so that each clock can be (re-)started, just pass "start". This will insert the setTimeout which keeps the clock ticking. The clock will start up again without having lost time :simple_smile: !
227
+
```JavaScript
228
+
$("div#clock").clock("start");
229
+
```
230
+
231
+
## Destroy, start and stop handlers
232
+
233
+
The chainability of the plugin passes an instance of the plugin itself, such that it's public methods can be invoked by the variable that might reference the first instantiation. The plugin includes a destroy(), a start() and a stop() method that are equivalent to the handlers of the same name.
234
+
```JavaScript
235
+
var $clocks =$("div.clock").clock(); //turn all divs with a "clock" class into jQuery Clocks
236
+
$clocks.stop(); //will stop all jQuery Clocks on divs with a "clock" class
237
+
$clocks.start(); //will start all jQuery Clocks on divs with a "clock" class
238
+
$clocks.first().stop(); //will stop the jQuery Clock on the first div with a "clock" class
239
+
240
+
$("#bigben").clock().stop(); //will initialize a jQuery Clock on the div with id = "bigben" and stop it in it's tracks...
241
+
$("#bigben").clock().start(); //will (re-)start the already initialized jQuery Clock on the div with id = "bigben"
242
+
```
243
+
244
+
## Modifying parameters on initialized jQuery Clocks
245
+
246
+
All and any parameters can be modified on an already initialized clock. Any modifications will be noticeable on the next tick of the clock.
247
+
```JavaScript
248
+
var $clocks =$("div.clock").clock(); //turn all divs with a "clock" class into jQuery Clocks
249
+
$clocks.first().clock({langSet:"vi"}); //change the locale of the jQuery Clock on the first div with a "clock" class and set it to Vietnamese
250
+
$clocks.clock({timeFormat:"H:i:s.v",rate:50}); //change the timeFormat on the jQuery Clocks on all divs with a "clock" class so that they display milliseconds, and update the tick rate of the clocks to 50 milliseconds
251
+
```
221
252
222
253
# Styling
223
254
@@ -315,3 +346,7 @@ Implements all PHP Style Format Characters except for "T" and "u". Adds a "**rat
Returns an instance of the plugin itself along with the dom elements. Adds "start" and "stop" handlers. Adds "destroy()", "start()" and "stop()" methods which have the same effect as the handlers.
0 commit comments