谷歌浏览器中的jQuery问题? fadeIn和fadeOut

时间:2013-07-03 21:27:30

标签: javascript html5 css3 jquery

我在使用 jQuery 时遇到了一些问题,所有内容都适用于IE和Firefox,但使用chrome时会出现一些奇怪的行为“当我点击多次点击(四次点击)时({{1 }})突然消失图像#top_slider_menu,在 jQuery HTML 的代码下面找到。 id="img_slide_current在所有浏览器中无效,我的意思是<h5>fadeOut

脚本代码:

fadeIn

}

HTML代码:

<br> <br> <br> <br> 

var in_work = false;

var fadeOutSpeed = 400;

var fadeInSpeed = 600;

var work_time = (fadeInSpeed + fadeOutSpeed) * 0 ;


function sliderChangeImage(targetId) {

if (in_work) return
else{
    in_work = true;
    current_slide_number = targetId;
}

setTimeout(function() {
    in_work = false;
}, work_time);
targetSrc = $("#img_slide_" + targetId).attr("src");
targetH = $("#slide_h5_" + targetId).text();
targetP = $("#slide_p_" + targetId).text();
var new_href = $('.top_slide'+targetId+' .slideshow_sideH a').attr('href');
cl = $(this).attr('class');
$("#top_slider_menu #1").attr('class', '');
$("#top_slider_menu #2").attr('class', '');
$("#top_slider_menu #3").attr('class', '');
$("#top_slider_menu #" + targetId).attr('class', 'active');
$("#img_slide_current").fadeOut(fadeOutSpeed, function() {
    $(this).load(function() {
        $(this).fadeIn(fadeInSpeed);

    });
    $("#img_slide_current").attr("src", targetSrc);
});
$(this).load(function() {
        $(this).fadeIn(fadeInSpeed);
    });
$(".slideshow_side").fadeIn(fadeInSpeed);
$("#slide_h5_current").fadeIn(fadeInSpeed, function() {
    $(this).text(targetH).fadeIn(fadeInSpeed)
    ;
});
$("#slide_p_current").fadeOut(fadeOutSpeed, function() {
    if ($(window).width() > 980) {
        $(this).text(targetP).fadeIn(fadeInSpeed);
    }
    $('.top_slide_current a').attr('href', new_href);

});
$(".slideshow_side").fadeIn(fadeInSpeed);

1 个答案:

答案 0 :(得分:0)

在调用fades之前尝试添加.stop()。

$(".slideshow_side").stop().fadeIn(fadeInSpeed);

这应该停止队列中的所有先前动画并触发最新动画。