Я сделал вращающийся слайдер в javascript и css. Функция Javascript делает его поворотным. Когда я в первый раз загружаю страницу, она работает нормально, но когда я перехожу к какой-либо другой странице, а затем возвращаюсь обратно, вызывается функция js, но слайдер не останавливается на повороте мыши. Я сделал функцию js, когда мышь наводится на div, остановка вращения, когда она покидает функцию, вызывается снова. Вот мой код js
var timer;
window.onload = function()
{
myTimer();
};
var $i=1;
function myTimer(){
timer=setInterval(function(){
if($i<6){
closeTab();
openTab($i);
$i++;
}
else
{$i=1;}
},2000);
}
closeTab();
var selectedSlider ;
function closeTab()
{
var $this = $('#accordion > li');
//$width=$(window).width();
//$this.stop().animate({'width':'110px'},500);
$this.stop().animate({'width':'7%'},500);
$('.heading',$this).stop(true,true).fadeIn();
$('.description',$this).stop(true,true).fadeOut(500);
$('.bgDescription',$this).stop(true,true).slideUp(700);
}
function openTab(id)
{
var $this = $('.bg'+id);
//$this.stop().animate({'width':'450px'},500);
$this.stop().animate({'width':'70%'},500);
$('.heading',$this).stop(true,true).fadeOut();
$('.bgDescription',$this).stop(true,true).slideDown(500);
$('.description',$this).stop(true,true).fadeIn();
}
openTab(1);
$(function() {
$('#accordion > li').hover(
function () {
console.log("in mouse hover");
var $this = $(this);
selectedSlider = $this.attr("class").replace("bg", "");
closeTab();
openTab(selectedSlider);
clearInterval(timer);
},
function () {
}
);
});
$('#accordion > li').mouseleave(function(){
console.log("in mouse leave");
myTimer();
});
Поскольку @David сказал, что браузер кэширует javascript, поэтому ваш код для зависания не работает, как вы выразились таким образом, что, когда js файл будет вызывать, событие hover - это огонь, но здесь js файл уже кэшируется.
Вы можете попробовать это, вместо того, чтобы использовать функцию зависания, анонимно поместить ее внутрь window.onload
.