In JQuery, How to hide the image when the user click?

+1 vote
52 views
asked Mar 16 by Suleman Asghar
edited Mar 16

How can we hide the Image when user clicks on it?

Like in the following snippet,

      <div class="content">
      <p>Some Content Here</p>
      <p class="loader"><img src="ajax-loader.gif"></p>
      </div>  
   

How can I hide the Image in JQuery when user will click on that Image.

2 Answers

0 votes
answered Mar 17 by anonymous
 
Best answer

Give your img tag some id or class

<img src="ajax-loader.gif" class="clickhidden"/>

then in you javascript file or script

$("img.clickhidden").on('click', function(){
    $(this).hide();
});

You can use data attribute as well

<img src="ajax-loader.gif" data-click-hidden="true"/>

 

$("a[data-click-hidden='true']").click(function() {
    $(this).hide();
});

Using data-attribute you will be 100% sure that your css will not be disturbed at all.

0 votes
answered Mar 17 by anonymous


$(document).ready(function(){

$("#imageid").click(function(){
    $(this).hide();
});

});

Welcome , qPocho is an online community for programmers share there knowledge.
...