我在使用 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);
答案 0 :(得分:0)
在调用fades之前尝试添加.stop()。
$(".slideshow_side").stop().fadeIn(fadeInSpeed);
这应该停止队列中的所有先前动画并触发最新动画。