fadeOut() doesn't work, hide() does, why?

fadeOut() doesn't work, hide() does, why?

I want to show an image in full size once it's thumbnail is clicked, however there is a problem with hiding the image, for some reason, fadeOut() won't do anything, however hide() does.

There's the code:

This is the div into which the image is appended:
  1. <a href="javascript:void(0)" onclick="hideImage()">
  2. <div id="fullImage"></div>
  3. </a>

The CSS:
  1. #fullImage {
  2.            position: fixed;
  3.            right: 0;
  4.            top: 0;
  5.            z-index: 20;
  6.            width: 100%;
  7.            height: 100%;
  8.            display: none;
  9.            background: rgba(0, 0, 0, 0.5);
  10.            text-align: center;
  11. }

This is the code I use to show the image itself:
  1. function showImage(link){
  2.   $("#fullImage").fadeIn();
  3.   $("#fullImage").empty().append('<img src="img/loading.gif" />').delay(1000, function(){ 
  4.     var image = new Image();
  5.     image.src = link;
  6.     image.onload = function(){
  7.       $("#fullImage").empty().append(image);
  8.     } 
  9.   });
  10. }

And now, if I want to close it using this, nothing happens:
  1. function hideImage(){
  2.   $("#fullImage").fadeOut();
  3. }   

However this actually hides that div: 
  1. function hideImage(){
  2.   $("#fullImage").hide();
  3. }   

Also I'd like to have the code like this:
  1. $("#fullImage").click(function() {
  2.       $("#fullImage").fadeOut();
  3. });
so there's no need for another function to close it as well as there won't need to be any A element, however, this approach doesn't work for me at all, with fadeOut nor with hide... 

Also, I'm sure you have noticed the ".delay(" part in showImage function... This is because without the .delay, first of all, the image was loaded and the whole DIV was faded in AFTER that, so basically, for a moment after clicking on a thumbnail, the user wouldn't know that something is happening... I'm not sure how to show "Loading" while the image is really being loaded other than using this...

I'm pretty lame with jQuery and with JavaScript in general and I just can't freakin' find out why this is happening... I'd be really thankful for any help!