JQuery-Hide Action

JQuery is a library of the JavaScript Programming Language.  It was introduced in order to make a website more dynamic. HTML and CSS which are the core languages for web development generate static content.

JQuery makes the website more fun and interactive for the end user. You can have buttons on the website which get highlighted or glow once the mouse is over them. It can also do animations, sliding panels  and many other things. In order to perform them, JQuery provides certain actions. The official motto of JQuery is to “Write Less Do More”. And this is exactly how JQuery works. With lesser number of statements, it can display a perceivable output.

There is a hide action in JQuery, which hides an element during an event. The event can be a time when you click on an element or hover over it. Today let’s see what happens when use a hide action with a click event.

Let’s suppose we have a  Blue Box

Capture

And we click the element. Then what is going to happen is, the box will disappear form the screen since we used the hide action on the click event. Let’s see how the code for this looks like.

$(document).ready(function(){

$(‘div’).click(function(){

$(‘div’).hide();

});

});

The above code basically means  that once the HTML document has loaded. And we click on the element, the concerned element disappears.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s