jQuery Plugin To Show / Hide Content Based On Specific Datetime - easyTimer
File Size: | 12.5 KB |
---|---|
Views Total: | 3578 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
easyTimer is a dead simple yet useful jQuery plugin that allows to show / hide web content based on the date & time you specify.
How to use it:
1. Load both jQuery library and the jQuery easyTimer plugin in the html document.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="js/easytimer.js"></script>
2. Wrap the content into a container and use the data
attributes to specify at which date or time that content should appear or disappear.
<div data-hide-until="2016-01-01"> <p> Hidden content until January 1st, 2016 </p> </div>
<div data-remove-until="2016-01-01"> <p> This content will completely self destruct on page load until January 1st, 2016, which it will then show. </p> </div>
<div data-show-until="2016-01-01"> <p> This content will display any time before January 1st, 2016. When that date comes it will hide. </p> </div>
<div data-hide-after="2016-01-01"> <p> This content will appear any time before January 1st, 2016. It will hide on and after January 1st, 2016. </p> </div>
<div data-remove-after="2016-01-01"> <p> This content will appear any time before January 1st, 2016. It will remove from DOM on and after January 1st, 2016. </p> </div>
<div data-show-after="2016-01-01"> <p> This content will be hidden any time before January 1st, 2016. It will show on and after January 1st, 2016. </p> </div>
This awesome jQuery plugin is developed by emiliog07. For more Advanced Usages, please check the demo page or visit the official website.