jQuery is display block or none

Updated Jun 7, 2020・1 minute read Post By Tony Lea

jQuery is excellent for creating compelling user interfaces. Some of the most common jquery functions include the .show, .hide, .toggle, .slideDown, .slideUp, or .slideToggle. Each of these functions toggle the CSS display attribute of that particular object. if it is hidden the display is set to 'none' otherwise if it is shown the display value is set to 'block'.

I wish jQuery would incorporate a .isDisplayed function; however, it is not available. There is the .isVisible function; although, this only returns true or false whether the visible attribute is set to visible or hidden. As we all know the best way to show and hide an element on a page is to toggle the display attribute. So, with all that said here is a simple function which will return true or false based on an objects display value.

//	isDisplayed('#div_id') will return true if the object is
//	displayed on the screen otherwise it will return false
function isDisplayed(object)
{// if the object is visible return trueif($(object).css('display') == 'block'){return true;}// if the object is not visible return falsereturn false;

© 2020 DevDojo LLC. All rights reserved.