Automate Content Visibility with jQuery Expire Content Plugin

File Size: 5.06 KB
Views Total: 40
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Automate Content Visibility with jQuery Expire Content Plugin

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.