0

私は現在、ウェブサイトのナビゲーションをまとめています。ナビゲーションは、タブ付きスタイルのメニューで非常に簡単です。各タブにカーソルを合わせると、タブが赤と白のテキストから白と赤のテキストにフェードします。マウスを離すと、赤いテキストの白いボタンから白いテキストの赤いボタンにフェードバックします。私はすべての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 ページの読み込み。

4

2 に答える 2

0

私は同意します、それは間違いなくもっと効率的に書くことができます。しかし、概念実証などのために、これは当分の間機能します。IE 8 のサポートを取得しようとしています。すべてのブラウザーでうまく機能しますが、IE 8 では、クロムやファイアフォックスのようにリンクをクリックする前にページが読み込まれるため、2 番目のラグはありません。

于 2013-06-25T12:48:50.337 に答える