Я знаю, что эта тема была рассмотрена как здесь , так и здесь , но я боюсь, что все еще не смог выяснить точный источник проблемы, которая вызываетмое слайд-шоу (с использованием FadeGallery ), чтобы поставить анимацию в очередь, пока я нахожусь на другой вкладке, а затем ускорить слайды после моего возвращения в Firefox.Есть ли какой-нибудь шанс, что кто-то может помочь мне решить эту проблему?
Я довольно ужасен с JS, и мне действительно некуда даже пытаться выяснить это самостоятельно ... но я был безрезультатным,Таким образом, любая помощь будет оценена.Судя по предыдущим постам, это может быть что-то с setTimeout
, .queue
или $(window).focus
, но я просто не совсем уверен, что нужно сделать, чтобы это изменить.
jQuery.noConflict();
jQuery(function(){
initSlideshow();
});
// slideshow init
function initSlideshow(){
jQuery('div.slide-show').fadeGallery({
pauseOnHover:true,
autoRotation:true,
switchTime:7000 //ms
});
};
// slideshow plugin
jQuery.fn.fadeGallery = function(_options){
var _options = jQuery.extend({
slideElements:'ul.slide > li',
pagerGener: true,
pagerHold: 'div.switcher',
pagerLinks:'div.switcher li',
btnNext:'a.btn-next',
btnPrev:'a.btn-prev',
btnPlayPause:'a.play-pause',
btnPlay:'a.play',
btnPause:'a.pause',
pausedClass:'paused',
disabledClass: 'disabled',
playClass:'playing',
activeClass:'active',
currentNum:false,
allNum:false,
startSlide:null,
noCircle:false,
caption:'ul.caption > li',
pauseOnHover:true,
autoRotation:false,
autoHeight:false,
onChange:false,
switchTime:3000,
duration:650,
event:'click'
},_options);
return this.each(function(){
// gallery options
var _this = jQuery(this);
var _slides = jQuery(_options.slideElements, _this);
var _btnPrev = jQuery(_options.btnPrev, _this);
var _btnNext = jQuery(_options.btnNext, _this);
var _btnPlayPause = jQuery(_options.btnPlayPause, _this);
var _btnPause = jQuery(_options.btnPause, _this);
var _btnPlay = jQuery(_options.btnPlay, _this);
var _pauseOnHover = _options.pauseOnHover;
var _autoRotation = _options.autoRotation;
var _activeClass = _options.activeClass;
var _disabledClass = _options.disabledClass;
var _pausedClass = _options.pausedClass;
var _playClass = _options.playClass;
var _autoHeight = _options.autoHeight;
var _duration = _options.duration;
var _switchTime = _options.switchTime;
var _controlEvent = _options.event;
var _currentNum = (_options.currentNum ? jQuery(_options.currentNum, _this) : false);
var _allNum = (_options.allNum ? jQuery(_options.allNum, _this) : false);
var _startSlide = _options.startSlide;
var _noCycle = _options.noCircle;
var _onChange = _options.onChange;
var _pagerGener = _options.pagerGener;
var _pagerHold = jQuery(_options.pagerHold,_this);
var _caption = jQuery(_options.caption,_this);
var _paging = '';
if(_pagerGener){
for(var i=0; i< _slides.length; i++){
_paging += '<li><a href="#">'+(i+1)+'</a></li>';
}
_pagerHold.html('<ul>'+_paging+'</ul>');
}
var _pagerLinks = jQuery(_options.pagerLinks, _this);
// gallery init
var _hover = false;
var _prevIndex = 0;
var _currentIndex = 0;
var _slideCount = _slides.length;
var _timer;
if(_slideCount < 2) return;
_prevIndex = _slides.index(_slides.filter('.'+_activeClass));
if(_prevIndex < 0) _prevIndex = _currentIndex = 0;
else _currentIndex = _prevIndex;
if(_startSlide != null) {
if(_startSlide == 'random') _prevIndex = _currentIndex = Math.floor(Math.random()*_slideCount);
else _prevIndex = _currentIndex = parseInt(_startSlide);
}
_slides.hide().eq(_currentIndex).show();
_caption.hide().eq(_currentIndex).show();
if(_autoRotation) _this.removeClass(_pausedClass).addClass(_playClass);
else _this.removeClass(_playClass).addClass(_pausedClass);
// gallery control
if(_btnPrev.length) {
_btnPrev.bind(_controlEvent,function(){
prevSlide();
return false;
});
}
if(_btnNext.length) {
_btnNext.bind(_controlEvent,function(){
nextSlide();
return false;
});
}
if(_pagerLinks.length) {
_pagerLinks.each(function(_ind){
jQuery(this).bind(_controlEvent,function(){
if(_currentIndex != _ind) {
_prevIndex = _currentIndex;
_currentIndex = _ind;
switchSlide();
}
return false;
});
});
}
// play pause section
if(_btnPlayPause.length) {
_btnPlayPause.bind(_controlEvent,function(){
if(_this.hasClass(_pausedClass)) {
_this.removeClass(_pausedClass).addClass(_playClass);
_autoRotation = true;
autoSlide();
} else {
_autoRotation = false;
if(_timer) clearTimeout(_timer);
_this.removeClass(_playClass).addClass(_pausedClass);
}
return false;
});
}
if(_btnPlay.length) {
_btnPlay.bind(_controlEvent,function(){
_this.removeClass(_pausedClass).addClass(_playClass);
_autoRotation = true;
autoSlide();
return false;
});
}
if(_btnPause.length) {
_btnPause.bind(_controlEvent,function(){
_autoRotation = false;
if(_timer) clearTimeout(_timer);
_this.removeClass(_playClass).addClass(_pausedClass);
return false;
});
}
// gallery animation
function prevSlide() {
_prevIndex = _currentIndex;
if(_currentIndex > 0) _currentIndex--;
else {
if(_noCycle) return;
else _currentIndex = _slideCount-1;
}
switchSlide();
}
function nextSlide() {
_prevIndex = _currentIndex;
if(_currentIndex < _slideCount-1) _currentIndex++;
else {
if(_noCycle) return;
else _currentIndex = 0;
}
switchSlide();
}
function refreshStatus() {
if(_pagerLinks.length) _pagerLinks.removeClass(_activeClass).eq(_currentIndex).addClass(_activeClass);
if(_currentNum) _currentNum.text(_currentIndex+1);
if(_allNum) _allNum.text(_slideCount);
_slides.eq(_prevIndex).removeClass(_activeClass);
_slides.eq(_currentIndex).addClass(_activeClass);
if(_noCycle) {
if(_btnPrev.length) {
if(_currentIndex == 0) _btnPrev.addClass(_disabledClass);
else _btnPrev.removeClass(_disabledClass);
}
if(_btnNext.length) {
if(_currentIndex == _slideCount-1) _btnNext.addClass(_disabledClass);
else _btnNext.removeClass(_disabledClass);
}
}
if(typeof _onChange === 'function') {
_onChange(_this, _currentIndex);
}
}
function switchSlide() {
_slides.eq(_prevIndex).fadeOut(_duration);
_slides.eq(_currentIndex).fadeIn(_duration);
_caption.eq(_prevIndex).fadeOut();
_caption.eq(_currentIndex).fadeIn();
if(_autoHeight) _slides.eq(_currentIndex).parent().animate({height:_slides.eq(_currentIndex).outerHeight(true)},{duration:_duration,queue:true});
refreshStatus();
autoSlide();
}
// autoslide function
function autoSlide() {
if(!_autoRotation || _hover) return;
if(_timer) clearTimeout(_timer);
_timer = setTimeout(nextSlide,_switchTime+_duration);
}
if(_pauseOnHover) {
_this.hover(function(){
_hover = true;
if(_timer) clearTimeout(_timer);
},function(){
_hover = false;
autoSlide();
});
}
refreshStatus();
autoSlide();
});
};
Спасибо!