У меня небольшая проблема с моей галереей jQuery, и я предполагаю, что это связано с оператором if.Вы можете увидеть, как это работает здесь: http://mojbastovan.com/gallery/lightbox.html
Что я хочу сделать, так это показать описание под изображением каждый раз, когда я наводю на него мышь, однако, это не работает.Попробуйте открыть изображение, и вы увидите, что, когда вы наводите мышь на увеличенное изображение, вы не видите его описание ниже, но когда вы отводите мышь от изображения и кладете его обратно, все работает безупречно.Так в чем проблема?Я даже добавил оператор if, но он не работает, так может кто-нибудь помочь мне с этим?Да, и еще один вопрос, работают ли функции отображения, скрытия и анимации в Chrome с перебоями?Я протестировал его в нескольких браузерах, и кажется, что Chrome делает эти функции немного изменчивыми.Вот мой код:
$(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);
$("#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();
}
}