ネストされたdivのコンテンツは、クリック可能ではありません。

Question

私のサイトには、基本的にサイドナビであり、左に浮かんで3番目のサイトを占有しています。クリックすると、右に開き、その領域にあるものの上に現れるラッパー領域の他の2/3を占める 'meganav-div'のクラスで子divを開きます。

現在、私はすべてのブラウザで動作しています。ie6とie7以外は、最初の項目（div＃1）を開き、すべての項目をクリックしてください。 #threeなど）は、これらのdiv内のリンクがクリックできないという点では機能していません。各divには、すべてのブラウザで動作するクローズボタンがありますが、ie6と7は使用できません。カーソルはすべてのアンカーのポインタに変更されますが、クリックしないだけです。私はこれが最初の1つが働いてからz-indexと関係があると仮定していますが、navリストの下位のものではありませんが、私はすべての.meganav-divのz-indexを追加しました。

下記のコードをご覧ください。どんな助けでも大歓迎です。ありがとう。 jsfiddleへのリンクを見つけてください：http://jsfiddle.net/tomiswoot/vqJnY/1/

 <section id="herocontainer"> 
      <div class="hero-white"> 

       <aside> 
        <ul id="mainnav"> 
          <a href="#">Nav item 1</a> 
          <!--===MEGANAV one====-----> 
           <div id="one" class="meganav-div"> 
            MEGANAV DIV CONTENT HERE 
           </div> 
         </li> 
         <li> 
          <a href="#">Nav item 2</a> 
          <!--===MEGANAV two====-----> 
           <div id="two" class="meganav-div"> 
            MEGANAV DIV CONTENT HERE 
           </div> 
         </li> 
         <li> 
          <a href="#">Nav item 3</a> 
          <!--===MEGANAV three====-----> 
           <div id="three" class="meganav-div"> 
            MEGANAV DIV CONTENT HERE 
           </div> 
         </li> 
         <li> 
          <a href="#">Nav item 4</a> 
          <!--===MEGANAV four====-----> 
           <div id="four" class="meganav-div"> 
            MEGANAV DIV CONTENT HERE 
           </div> 
         </li> 
         <li> 
          <a href="#">Nav item 5</a> 
          <!--===MEGANAV five====-----> 
           <div id="five" class="meganav-div"> 
            MEGANAV DIV CONTENT HERE 
           </div> 
         </li> 
        </ul> 
       </aside> 

      </div> 
     </section> 

Answer 1

それはあなたが同じid = close1で複数の密接なボタン有しているという事実に起因しています - あなたのhtmlが無効になります。私は、テストケースを提供することができます

http://jsfiddle.net/vqJnY/7/