jQuery(document).ready(function() {
var t = $(".dox li"),
b = $(".dox div");
var index = 0;
var timer = null;
// if (t.length != b.length) return;
for (var i = 0; i < t.length; i++) {
t[i].id = i;
$(t[i]).mouseover(function() {
var that = this;
clearInterval(timer);
timer = setTimeout(function() {
for (var j = 0; j < b.length; j++) {
b.css("display", "none");
t.removeClass();
};
$(that).addClass('hover');
$(b[that.id]).css("display", "block");
}, 150);
// console.log(this.id)
index = this.id;
});
$(t[i]).mouseout(function() {
// clearInterval(timer);
timer = setInterval(function() {
index++;
if (index >= t.length) {
index = 0;
}
for (var j = 0; j < b.length; j++) {
b.css("display", "none");
t.removeClass();
};
$(t[index]).addClass('hover');
$(b[index]).css("display", "block");
}, 2000);
});
};
// if (timer) {
// clearInterval(timer);
// timer = null;
// }
timer = setInterval(function() {
index++;
if (index >= t.length) {
index = 0;
}
for (var j = 0; j < b.length; j++) {
b.css("display", "none");
t.removeClass();
};
$(t[index]).addClass('hover');
$(b[index]).css("display", "block");
console.log(index);
}, 2000);
});