mr.soroush
mr.soroush

Reputation: 1130

fadeOut fadeIn Chrome issue

I have tried to fadeOut a div and fadeIn another div in a same time. It works in Firefox and IE(7-9) correctly, and it works in Chrome too. In chrome, though, after fadeOut, my page has to scroll to the top and then fadeIn.

I want as situation where there isn't a scroll in Google Chrome like in Firefox and IE.

$("ul.main_news li:eq(0)").hover(function(){
    $(".a").stop(true, true).fadeOut(300).promise().done(function(){
    $(".b").stop(true, true).fadeIn();  
    }); 
    $(this).removeClass("asew");
    $(this).addClass("sdghe");
    $("ul.main_news li:eq(1)").removeClass("sdghe");
    $("ul.main_news li:eq(1)").addClass("asew");
    });


$("ul.main_news li:eq(1)").hover(function(){
    $(".b").stop(true, true).fadeOut(300).promise().done(function(){
    $(".a").stop(true, true).fadeIn();
    });
    $(this).removeClass("asew");
    $(this).addClass("sdghe");
    $("ul.main_news li:eq(0)").removeClass("sdghe");
    $("ul.main_news li:eq(0)").addClass("asew");
});

Upvotes: 2

Views: 347

Answers (3)

user1727063
user1727063

Reputation:

You don't want use stop() method anywhere! Maybe it has some problem with use in callback of fadeOut()! try this:

("ul.main_news li:eq(1)").hover(function(){
      $(".b").stop(true, true).fadeOut(300).promise().done(function(){
        $(".a").fadeIn();
    });

Upvotes: 1

Saeed
Saeed

Reputation: 3785

You should use this code without a callback:

$(".a").stop(true, true).fadeIn(300);       
$(".b").stop(true, true).fadeOut(0);

Upvotes: 1

Saeed
Saeed

Reputation: 3785

you should use this code insted of promise()

$(".b").stop(true, true).fadeOut(300).queue(function(){
    $(".a").stop(true, true).fadeIn();
});

Upvotes: 2

Related Questions