如果你发现，幻灯片会变得疯狂

我已经制作了一个简单的幻灯片..它的工作方式就像它应该在你离开时离开窗口并在一段时间后退回窗口然后…然后幻灯片显示它已经停滞不前，它需要跟上幻灯片当窗口在后台时滚动或滚动..幻灯片连续播放，一段时间后恢复正常

剧本：

function Slideshow(){ var _this = this; this.i = 0; this.num = 0; this.slide = null; this.slide_txt_bg = null; this.opacity_hover = 0.95; this.opacity_hout = 0.5; this.opacity_txt_out = 0; this.opacity_txt_in = 0.6; this.width = 340; this.time = 18; this.time_clicked = 25; this.interval = null; this.btn_next = null; this.btn_prev = null; this.clicked = false; this.cnstr = function(){ this.slide = $('#slideshow_film').detach(); this.slide_txt_bg = $('#slideshow_txt_bg').css('opacity', this.opacity_txt_in); var slideshow = $('#slideshow'); if(slideshow.length > 0){ if(this.slide.length > 0){ var slideshow_inner = $('#slideshow_inner').append(this.slide); this.num = this.slide.find('tr')[0].cells.length; this.slide.css('width', (this.num * 100)+'%'); var controls = $('
').prependTo(slideshow); this.btn_prev = $('
').appendTo(controls) .bind('click', { mode : -1 }, this.btn_click) .css('opacity', this.opacity_hout) .mouseover(this.btn_hover) .mouseout(this.btn_hout); this.btn_next = $('
').appendTo(controls) .bind('click', { mode : 1 }, this.btn_click) .css('opacity', this.opacity_hout) .mouseover(this.btn_hover) .mouseout(this.btn_hout); this.auto_roll(); } else{ slideshow.remove(); } } }; this.auto_roll = function(){ if(this.interval){ clearInterval(this.interval); this.interval = null; } var time = (this.clicked ? this.time_clicked:this.time) * 1000; this.interval = setInterval(function(){ _this.btn_next.click(); }, time); }; this.btn_click = function(e){ _this.txt_bg_out(); if(e.which){ _this.clicked = true; } _this.auto_roll(); _this.i += e.data.mode; if(_this.i  _this.num - 1){ _this.i = 0; } var value = _this.i * _this.width * -1; _this.slide.animate({ left : value+'px' }, 800, _this.txt_bg_in); }; this.txt_bg_in = function(){ _this.slide_txt_bg.delay(500).fadeTo(700, _this.opacity_txt_in); }; this.txt_bg_out = function(){ _this.slide_txt_bg.fadeTo(300, _this.opacity_txt_out); }; this.btn_hover = function(){ $(this).fadeTo(300, _this.opacity_hover); }; this.btn_hout = function(){ $(this).fadeTo(300, _this.opacity_hout); }; } 

代码：

 
 
 
 
 
 
 
 
 
headline
 
  
 
 text 
 
 
 
headline
 
  
 
 text 
 
 
 
headline
 
  
 
 text 
 
 
 
headline
 
  
 
 text 
 
 
  

Answer 1

我不久前有这个问题。 我通过停止窗口模糊的幻灯片显示并在焦点上重新启动它来解决它：

 jQuery(window).blur(function() { // Stop slideshow }).focus(function() { // Restart slideshow });