onClick show/hide Want to collapse image size on hide javascript

Question

I've just put this script together, but theres a problem with it, if the image is sat between text, it keeps the height difference when it's not visible, anyone got any ideas on how to collapse the size or something simlar when show/hiding?

Body

    a onclick="showImage();"> Click here</a>
    img id="loadingImage" src="image.png" style="visibility:hidden"/>

Script

function showImage(){
    var toggleImage = document.getElementById("loadingImage");
      if(toggleImage.style.visibility == "visible") {
         document.getElementById('loadingImage').style.visibility='hidden';
     }else{
        document.getElementById('loadingImage').style.visibility='visible';
}
}

Answer 1

Don't use visibility. Use display property instead.

As you can see @ MDN:

The (visibility) hidden value hides an element but leaves space where it would have been.