My jquery code is not running on chrome and in mozilla they are running but not as i wished…i want something like google search image you mouse over it get bigger and on mouse out it gets to original size…in mozilla they get stuck if i hover in and out too fast…any suggestion my code
jQuery(document).ready(function(){
$('div .m1').hover(function(){
contr++;
$(".m1").css({ “height” : “138px”, “width” : “224px”, “left” : “0px”, “top” : “0px”});
relo();
$(this).parent().prev(‘span’).removeClass(“spankjiu”);
$(this).children().children().animate({“width”:“300px”, “height”:“200px”},“normal”);
$(".spankjiu").fadeIn(100);
$(".spankjiu").css({"color":"#777"});
$(this).css({"z-index" : 23,"opacity":"0.8"});
$(this).addClass("borrad7");
$(".a1").css({"color":"#fff"});
$(".a2").css({"color":"#fff"});
$(this).animate({
height : "200",
width : "300",
left : "-=45",
top : "-=36"
}, 200,function(){
$(this).removeClass(“borrad7”);
$(this).addClass(“borrad5”);
});
},function(){
$(".a1").css({"color":"#629532"});
$(".a2").css({"color":"#777"});
$(this).removeClass("borrad5");
$(this).addClass('borrad6');
$(this).parent().prev('span').removeClass('borrad8');
$(this).children().children().css({"width":"224px", "height":"138px"});
$(this).css({
height : “138px”,
width : “224px”,
left : “0px”,
top : “0px”,“z-index” : 0,“opacity”:“1”
});
$(this).removeClass(“borrad6”);
$(".spankjiu").fadeOut(‘fast’);
$(this).parent().prev(‘span’).addClass(“spankjiu”);
$(".spankjiu1").css({“color”:"#fff"});
});
});