Display (show) or hide elements

Some easy ways that shows how to show or hide elements using pure JavaScript and jQuery.


Libraries

Code Snippet
// Pure JavaScript
document.getElementById('element').style.display = 'none';  // Hide
document.getElementById('element').style.display = 'block';  // Show
document.getElementById('element').style.display = 'inline';  // Show
document.getElementById('element').style.display = 'inline-block';  // Show

document.getElementById('element').style.visibility = 'hidden';  // Hide
document.getElementById('element').style.visibility = 'visible';  // Show


// Using jQuery
$('#element').hide();  // Hide
$('#element').show();  // Show


Implementation

In all these examples above the element with the id of "element" was hided or showed.





Comments
  • mode_editWrite a comment



  • forumComments




Embed Code

We provide special containers which include the full snippet and a link to this site. So for example when you make a tutorial and you are using code from this site, you can use one of the following snippet embeddings:

Load Preview Get Code Close Preview







    Share
    Rating
    thumb_up 1 thumb_down
    Author
    Thorolus

    I'm the head developer and co-founder of GlovilGames Studios (glovilgames.com) and other platforms GlovilGames created, like vsnippets.com, worth-calculator.net, python-obfuscator.com and some mobile apps and games.

    Tags
    Show
    Hide
    display



    Informations

    posted on 2016-09-13 21:05:59

    viewed 28 times

    snippet's UUID is 57d84e1736ca9

    Similar Snippets