私は現在、ウェブサイトのナビゲーションをまとめています。ナビゲーションは、タブ付きスタイルのメニューで非常に簡単です。各タブにカーソルを合わせると、タブが赤と白のテキストから白と赤のテキストにフェードします。マウスを離すと、赤いテキストの白いボタンから白いテキストの赤いボタンにフェードバックします。私はすべての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の不透明度の問題ですか?私はそうは思わない、それ以外の場合は動作します。www
私が望むのは、ユーザーがタブをクリックして次のページに移動したときに、ボタン内のテキストが消えないようにすることだけです。何らかの理由で消えてしまいます。$('red-text').show(); があっても 1 ページの読み込み。