0

このように直接質問するのは本当に嫌いですが、左側のサブナビゲーション ([About Us] にカーソルを合わせる) が数時間 IE に表示されず、問題を再現できない理由を理解しようとしています。フィドルで:-/ ここにサイトがあります:
http://quinnhr.adsinchosting5.com/


updateその ^ サイトのコードを必ず見てください。これは、簡潔にするために問題があると思われる場所のほんの一部に過ぎないからです。/update
以下は、html と css のスニペットです。

        <nav> <!-- left sidebar -->
            <ul>
                <li>
                    <a href="#"> Capabilities </a>
                </li>
                <li>
                    <a href="#"> Pricing </a>
                </li>
                <li>
                    <a href="#">About Us</a>
                    <ul id="subNizzle"> <!-- this UL is the issue, see css -->
                        <li class="subNav">
                            <a href="#">someone's name</a>
                        </li>
                        <li class="subNav">
                            <a href="#">some else's name</a>
                        </li>
                        <li class="subNav">
                            <a href="#">another name</a>
                        </li>
                    </ul>
                </li>

CSS ***はい、表示なしが設定されていることはわかっています。jquery コードはホバー時にそれを上書きします。コードについては quinnhr.adsinchosting5.com を参照してください。オフにする

section aside: first-of-type ul li a{
display:table-cell;
}

少なくともサブナビが表示されるようにしますが、既存のナビの上に表示され、次の方法で右に移動します。

section aside:first-of-type ul li a{
 position: absolute;
 }
 section aside:first-of-type ul li ul{
 position: absolute;
 right:-100px;
 z-index: 1000;
 }

それが表示され、ナビの外に隠されていることを示すのに十分なほど右に移動します...

  section aside:first-of-type ul {
  display: table;
  margin-left: 70px;
  margin-top: 25px;
  padding: 0px;
  position: absolute; }

section aside:first-of-type ul li {
  display: table;
  height: 45px;
  position: relative;
  width: 180px; }

section aside:first-of-type ul li a {
  color: #F0EBDA;
  display: table-cell; 
  height: 45px;
  text-decoration: none;
  text-indent: 10px;
  vertical-align: middle; 
  position:absolute;  /* update */
}


section aside:first-of-type ul li ul {
  display: none;
  margin: -45px 0px 0px 179px;
  padding: 0px;
  position:absolute; /* update */
  right: -100px;    /* update */
}

jQuery: Query(document).ready(function($) {

$('li a').addClass("nahbro");
$('ul li ul').css({"margin-left": "-10px", "padding" : "0px", "margin-top" : "-45px"});
$('li').hover(function(){
    $(this).switchClass("nahbro", "prepare", 400);
    $('#subNizzle', this).fadeIn().switchClass("nahbro", "prepare", 300);
    $('.subNav').hover(function(){
        $(this).switchClass("prepare", "liSelected", 200);
    },function(){
        $(this).switchClass("liSelected", "prepare", 200);
    });

}, function(){
    $(this).switchClass("prepare", "nahbro", 400);
    $('#subNizzle', this).fadeOut().switchClass("liSelected", "nahbro", 500);

});

display:table / display: table-cell / display: block チェーンのどこかに関係があると思います...

4

2 に答える 2

0

<nav>andタグを使用してsectionいて、IE9 がそれをサポートしていないためです。nav, sectionタグを次のように置き換える必要がありますdiv

于 2013-01-03T00:27:33.520 に答える
0

最後に、サブナビが表示されない理由を見つけました:正しく配置されていましたが、次の場合:

フィルター: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d9090', endColorstr='#545e5f',GradientType=0 );

何らかの理由で、フィルターの範囲外のすべてを非表示にします。これは奇抜です。しかし、少なくとも今は知っています。

于 2013-01-03T17:21:38.047 に答える