jquery - FadeIn image after it is loaded -

I am trying to load the image with fade in effect in the div. The problem is that I do not know that one How to avoid shipment and vanishing time. I want to load the image and it should be faded after it is fully loaded.

These images are thumbs up:

  & lt; Div id = "thumb" & gt; & Lt; A href = "#" class = "slika_thumb" id = "1" & gt; & Lt; Img src = "slike / th.jpg" range = "0" /> & Lt; / A & gt; & Lt; A href = "#" square = "slack_thumb" id = "2" & gt; IMG src = "swipe / th. Jpg" range = "0" /> & Lt; / A & gt; & Lt; A href = "#" square = "slika_thumb" id = "3">  gt; & Lt; / A & gt; & Lt; A href = "#" & gt; & Lt; Img src = "Slike / th.jpg" range = "0" /> gt; & Lt; / A & gt; & Lt; A href = "#" & gt; & Lt; Img src = "rock / th.jpg" range = "0" /> & Lt; / A & gt; & Lt; A href = "#" & gt; & Lt; IMG src = "swipe / th. Jpg" range = "0" /> & Lt; / A & gt; & Lt; / Div & gt; & Lt; / Div & gt;  

This is the container where the image should load:

  & lt; Div id = "desna_kolona" & gt; & Lt; Div id = "slika" & gt; & Lt; Img src = "slike / c6.jpg" /> & Lt; / Div & gt; & Lt; / Div & gt;  

And this is a jquery file:

  $ (document) .ready (function () {$ ('slika_thumb'). ) {Var id = $ (this) .attr ("id"); $ ('# slika'). Hide (); $ .ajax ({url: 'slike / slika.php? Id =' + ID, success : Function (data) {$ ('# slika') .html (data); $ ('# slika'). FadeIn ();}});});});  

I tried to use complete below success but still the same result any advice?

It is possible that try to bind the loadloader of any images inside the data that That loads by AJAX. ( $ {document}). $ (Document) .ready (function () {$ ('slika_thumb'). Click (function () {var id = $ (this) .attr ("id"); $ ('# slika') Hide ( $ .ajax ({url: 'slike / slika.php? Id =' + ID, success: function (data) {$ ('# slika'). Html data ()); $ ('# slicone img' ). Bind ("load", function () {$ ('# slica'). FadeIn ();}}}}}}}})}};