As in topic. I have dynamic gallery containing just 3 elements: http://szycha.kylos.pl/test/gal.html http://szycha.kylos.pl/test/js/gallery.js -script
Problem occures when image is clicked another time(you have to click
quick to see the problem) before end of animation. I think that
preventing it from being clicked would solve the problem but im not
sure.
Please help me find the solution
Code:
$(function() {
$('#gallery img').click(function() {
var zIn=$(this).css('zIndex');
if(zIn==3){
$(this).animate({"width":"365px","height":"265px"},
300,function(){
$
(this).animate({"width":"363px","height":"262px"},500);}
);
}else{
$(this).animate({ "left" : "0px",
"opacity" : ".05" }, 300,function() {
$(this).animate({
"top" :
"0px",
"opacity" : "1",
"width":"363px","height":"262px"
},300, function(){
$(this).css
('zIndex', '3');
$('#gallery
img').not(this).each(function(j){
j++;
var
box_zIn=$(this).css('zIndex');
if
( box_zIn==3 && zIn==2 ){ //click box 2
$
(this).animate({ "left":"40px",
"height":"250px",
"width":"346px"
},
300).css('zIndex', '2');
}
if
(box_zIn==3 && zIn==1){ //click box 1
$
(this).animate({ "left":"40px",
"height":"250px",
"width":"346px"
},
300).css('zIndex', '2');
}
if
(box_zIn==2 && zIn==1){ //click box 1
$
(this).animate({ "left":"75px",
"height":"240px",
"width":"333px"
},
300).css('zIndex', '1');
}
});
});
}
);
}
//return false;
});
});
