So I have this code that delete me some classes every 8000 milliseconds. But I want to clear the interval everytime it delete that class and start over when that class exist again.
So here’s an example
<div id="oneTab" class='secondaryNav activeTab'></div>
I want to delete the “activeTab” class after 8000 milliseconds and reset and stop the timer then only when the class exists again to start the timer again.
var count = 1;
var timer = 8000;
function transition() {
if(count == 1) {
$('.secondaryNav').removeClass('activeTab');
$('.navLink').removeClass('active');
count = 2;
} else if(count == 2) {
$('.secondaryNav').removeClass('activeTab');
$('.navLink').removeClass('active');
count = 3;
} else if(count == 3) {
$('.secondaryNav').removeClass('activeTab');
$('.navLink').removeClass('active');
count = 1;
}
}
setInterval(transition, timer);
Or it might be an easier way with JS to delete a class a add another when clicking outside the div or link
function openTab(evt, tabName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("secondaryNav");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].classList.remove("activeTab");
}
tablinks = document.getElementsByClassName("navLink");
for (i = 0; i < tablinks.length; i++) {
tablinks.className = tablinks[i].classList.remove("active");
}
document.getElementById(tabName).classList.add("activeTab");
evt.currentTarget.className += " active";
tabcontent[i].classList.remove("activeTab");
}
I have this code that opens different tab depending on the link but I want that tab to disappear if I click outside the tab or everywhere else except his link.
I tried making some clearInterval(timer)
methods, but I couldn’t make it.
On the JS code I tried adding a class “fadedTab” but it adds that class to all tabs except the activeTab one and I only want to add it to the last tab for like 3-4 seconds that remove that class.