Onmouseout for tabs

I’m trying to add an onmouseout for a tab function and I’m using w3schools tab example, which has an onmouseover and that would show the tabcontent when hovering on tablink, but the content stays in, and an onmouseout would probably solve my question, the only problem is that I have no idea how to get around that. Thanks!

Example

London
Paris
Tokyo

London

London is the capital city of England.

London

London 2 is the capital city of England.

Javascript

function openCity(evt, cityName) {
// Declare all variables
var i, tabcontent, tablinks;

// Get all elements with class=”tabcontent” and hide them
tabcontent = document.getElementsByClassName(“tabcontent”);
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}

// Get all elements with class=”tablinks” and remove the class “active”
tablinks = document.getElementsByClassName(“tablinks”);
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}

// Show the current tab, and add an “active” class to the link that opened the tab
document.getElementById(cityName).style.display = “block”;
evt.currentTarget.className += ” active”;
}

Read more here:: Onmouseout for tabs

Leave a Reply

Your email address will not be published. Required fields are marked *