I have been spending a good amount of time lately playing around with jQuery plugins. It can very useful to create a plugin, especially if you are going to be reusing the functionality in many different pages/sites. I have created a plugin called One Show Hide, which will hide html elements and add a show/hide link to toggle the visibility.

This plugin helps to solve the issue when you have a really long list, but only want to show the first 10-15 items, and hide the rest. And give the user the option to see the hidden items by clicking a link.

Its a very basic plugin, but can be quite useful and is very easy to implement.
jQuery has a huge plugin population and some can be quite advanced. This plugin is very simple, but it gets the job done. Please check it out, give it a try and let me know what you think!

Categories: jQueryOpen Source

2 thoughts on “One Show Hide – a jQuery Plugin”

guest · August 21, 2010 at 4:03 am

Hi. Plugin great. it need to add .animate(), and why oneShowHide? i think look better “ShowHide” 🙂

Cheryl · September 29, 2010 at 6:22 pm

Absolutely love this – it works great! Is there a way to easily use this multiple times on one page?

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Posts

GruntJS

My First GruntJS Plugin: Bust My Cache

GruntJS is a JavaScript Task runner that has been around for about 2+ year, at least as far as I can remember. I started playing around with GruntJS which uses Node.js about a year ago, Read more…

HTML5

HTML5 Local Storage and Web Personalization

I have just finished doing some research on using HTML5 Local storage instead of Cookies for website personalization and have come to the conclusion that everyone should be using HTML5 local storage in place of Read more…

eCommerce

How to implement Bronto Email JavaScript Conversion tracking in Google Tag Manager

This tutorial will show you how to setup Bronto Advanced JavaScript Conversion tracking using Google Tag Manager. Bronto Advanced JavaScript tracking gives you more visibility to all of the products that customers are purchasing, then Read more…