In many cases we do not want make two buttons to show or hide a same div area. for example expand and collspan method. jQuery provides a simple technique to check div id is already shown or hidden.
Create a div are on which you want to do operation:
<div><a href="javascript:void(0)" onclick="__showHideFullDetail('showhidearea')">Click on me</a></div> <div id="showhidearea">Content will be here!!!</div> |
Then make a function in the javascript in your head tag.
function __showHideFullDetail(divID) { if ( jQuery('#' + divID).is(':hidden') ) { jQuery('#' + divID).show('slow'); } else { jQuery('#' +divID).hide('slow'); } } |
In this function we checked that provided div id is already shown or hidden. If it status is hidden then it will show it otherwise hide it.