Automate Content Visibility with jQuery Expire Content Plugin
File Size: | 5.06 KB |
---|---|
Views Total: | 58 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Expire-Content is a tiny yet useful jQuery plugin that helps developers and marketers manage time-sensitive webpage content.
When the current date surpasses the defined date, the plugin marks the specified content as "expired" and hides it.
Additionally, it provides a 'show_af' action to display content once the current date exceeds the set date. Before this date, the content remains hidden.
You can use the plugin to hide outdated promotions, limited-time offers, or event information automatically. It is useful for blogs, e-commerce sites, or any platform that features time-bound content.
How to use it:
1. Download the Expire-Content plugin files and include them in your HTML file along with the latest jQuery library.
<link rel="stylesheet" href="css/expire_content.css" /> <script src="/path/to/cdn/jquery.min.js"></script> <script src="js/expire_content.js"></script>
2. Wrap your content within a date_expire
container and specify the expiration date using data
attributes.
<div class="date_expire" data-month="May" data-day="15" data-year="2024" data-time="12:00" data-hideparent="true"> This should be hidden after May 15, 2024 </div>
3. To show content after a specific date, add data-action="show_af"
to the element:.
<div class="date_expire" data-month="May" data-day="15" data-year="2024" data-time="12:00" data-hideparent="true"> <p class="date_expire_action" data-action="show_af"> This content will be shown after May 15, 2024 </p> </div>
How It Works:
The plugin iterates through elements with the 'date_expire' class, extracting the specified expiration date. It then compares this date to the current date, determining whether to show or hide the content based on the 'hideparent' setting and 'show_af' action.
If 'hideparent' is true, the entire block is hidden after the expiration date. Otherwise, it checks for sub-items with the 'date_expire_action' class and 'hide_af' or 'show_af' actions, hiding or showing them accordingly.
This awesome jQuery plugin is developed by Costellos. For more Advanced Usages, please check the demo page or visit the official website.