我目前正在为网站制作导航。导航非常直接，带有选项卡式菜单。当您将鼠标悬停在每个选项卡上时，选项卡会从带白色文本的红色 - 变为带红色文本的白色。当您移除鼠标时，它应该会从带有红色文本的白色按钮淡出到带有白色文本的红色按钮。我有所有的 jQuery 编写和工作。主要问题在于 Internet Explorer。它快把我逼疯了！
$(document).ready(function(){
$('.button-text').fadeIn();
$('.red-text').hide();
$('.red-text2').hide();
$('.red-text3').hide();
$('.red-text4').hide();
$('.red-text5').hide();
<!-- toggle visibility of red text on hover -->
$('.white-hover-nav-button').hover(function(){
$('.red-text').fadeIn('fast');
});
$('.white-hover-nav-button').mouseleave(function(){
$('.red-text').hide();
});
$('.white-hover-nav-button2').hover(function(){
$('.red-text2').fadeIn('fast');
});
$('.white-hover-nav-button2').mouseleave(function(){
$('.red-text2').hide();
});
$('.white-hover-nav-button3').hover(function(){
$('.red-text3').fadeIn('fast');
});
$('.white-hover-nav-button3').mouseleave(function(){
$('.red-text3').hide();
});
$('.white-hover-nav-button4').hover(function(){
$('.red-text4').fadeIn('fast');
});
$('.white-hover-nav-button4').mouseleave(function(){
$('.red-text4').hide();
});
$('.white-hover-nav-button5').hover(function(){
$('.red-text5').fadeIn('fast');
});
$('.white-hover-nav-button5').mouseleave(function(){
$('.red-text5').hide();
});
});
白色选项卡是 .white-hover-nav-button，文本是红色文本。
在 Internet Explorer 中，用户点击一个链接，页面就会发生变化。如果用户在页面更改时根本没有将鼠标移到那里，则白色按钮会再次出现，但其中没有文本，除非您将鼠标从按钮上移开然后重新打开。有谁知道为什么会这样做？随着我继续建立我的网站，我整个周末都在努力解决这个问题。它在 FF 和 Chrome 中完美运行，但 IE 像往常一样是一个巨大的失败。
这太可怕了。显然它应该工作。这是IE中的不透明问题吗？我不这么认为，否则它会起作用。wtf。
我想要的只是当用户单击选项卡并将他们定向到下一页时，我不希望按钮内的文本消失并且出于某种原因它会消失。即使我有 $('red-text').show(); 一页加载。