If statement not working in JavaScript

I've got a minor problem with my jQuery gallery, and I assume it's related to if statement. You can see how it works here: http://mojbastovan.com/gallery/lightbox.html

What I want to do is to show description bellow the picture each time I put a mouse over it, however, that doesn't work. Try opening an image and you'll see that when you put your mouse over the bigger image you don't see its description bellow, but when you move the mouse away from image, and put it back over everything works flawlessly.

So what's the problem? I have even added the if statement but it doesn't work, so can anyone help me out with this one? Oh, and another question, does show, hide and animate functions work choppy for you in Chrome? I've tested it on several browsers, and it seems that Chrome renders those functions bit choppy. Here's my code:

$(document).ready(function() {
$("#box, #box2, #black, #bgal, #pic, #button").hide();
    $("#main img").click(function(){
        $("#load").show()
        finished=false;
    //  alert($("#slike").children().size())
    broj=$("#main img").index(this)+1;
    x=$(this).attr('src');
    $.getJSON('baza.json', function(json){
    $.each(json.slike, function(i,v){
        if (v.t_sr==x){
            nsrc=v.sr;
            info=v.info;
            detail=v.detail;
            zamena(nsrc);
     //$("#pic img").attr('src',v.sr);

        }
        if ((broj > 2) && (broj < 9)) {
            $("#slike").animate({
                left: -152 *(broj-3)
            }, 200)
        }
    else if (broj<3){
        $("#slike").animate({
                left:0
            }, 200)
    }
    else if (broj>8){
        $("#slike").animate({
                left: -152 *5
            }, 200)
    }
    });
    });
$("#black").show(200, function(){
    $("#bgal").show(200);
});
    });
$("#slike img").click(function(){
    $("#pic").hide(function(){
        $("#load").show();
    });
    //  alert($("#slike").children().size())
    broj=$("#slike img").index(this)+1;
    if ((broj > 2) && (broj < 9)) {
            $("#slike").animate({
                left: -152 *(broj-3)
            }, 200)
        }
    else if (broj<3){
        $("#slike").animate({
                left:0
            }, 200)
    }
    else if (broj>8){
        $("#slike").animate({
                left: -152 *5
            }, 200)
    }
    x=$(this).attr('src');
    $.getJSON('baza.json', function(json){
    $.each(json.slike, function(i,v){
        if (v.t_sr==x){
            nsrc=v.sr;
            info=v.info;
            detail=v.detail;
            zamena(nsrc);
     //$("#pic img").attr('src',v.sr);

        }

    });
    });
     $("#black").show(200, function(){
    $("#bgal").show(200);
});
       });
    $("#pic img").mouseover(function(t){
clearTimeout(t);
$("开发者_JAVA技巧#info").text(info);
$("#detail").text(detail);
if (finished == false) {
    $("#box2").dequeue().stop(true, true).show('slide', {
        direction: 'down'
    }, 100);
    $("#box").dequeue().stop(true, true).show('slide', {
        direction: 'down'
    }, 100);
}
    });
    $("#pic img").mouseout(function(){
t=setTimeout("$('#box2, #box').dequeue().stop(true,true).hide('slide', {direction: 'down'}, 100);",50)

    })
     $("#button").mouseover(function(){
$("#button img").attr("src","images/button.png");
  })
   $("#button").mouseout(function(){
$("#button img").attr("src","images/buttono.png");
   })
   $("#button").click(function(){
$("#bgal").hide(100,function(){
        $("#black").hide(100);
        $("#pic").hide();
    });
    });
     $("#box2").mouseover(function(){
clearTimeout(t);
    })
    $("#box2").mouseout(function(){
    t=setTimeout("$('#box2, #box').dequeue().stop(true,true).hide('slide',        {direction: 'down'}, 100);",50)
});
     });
   //FUNKCIJE
    function zamena(nsrc){
$("#pic").hide();
nimg=new Image;
nimg.src=nsrc; // mora podesena promenljiva iz gl programa
nimg.onload = function(){
    $("#load").hide()
    $("#pic img").attr('src',nimg.src);
    $("#pic").show(1);
    $("#button").show();

}
   }

 $("#pic img").mouseover(function(){
    clearTimeout(t);
    $("#info").text(info);
    $("#detail").text(detail);
    if (finished == false) {
        $("#box2").dequeue().stop(true, true).show('slide', {
            direction: 'down'
        }, 100);
        $("#box").dequeue().stop(true, true).show('slide', {
            direction: 'down'
        }, 100);
    }
  })

Have you tried adding a t within the function? $("#pic img").mouseover(function(t){

Also I believe you need to add a semicolon at the end of the function. Try:

$("#pic img").mouseover(function(t){
    clearTimeout(t);
    $("#info").text(info);
    $("#detail").text(detail);
    if (finished == false) {
        $("#box2").dequeue().stop(true, true).show('slide', {
            direction: 'down'
        }, 100);
        $("#box").dequeue().stop(true, true).show('slide', {
            direction: 'down'
        }, 100);
    }
  });

I think the issue might be that mouseover event is not being triggered when the image slides under it. There are workarounds (tracking the position of the mouse on the document):

Mouseover/mouseenter not fired by browser on animated/moving element

The animation between my FF and Chrome seemed identical.