2012-03-13 15 views
3

テーブル内にJQuery UIモーダル(modal = true)とasp.netリストボックスを含むaspxページがあります。モーダルが呼び出されるたびに、常にモーダルが上の代わりにリストボックスの後ろに表示されます。私は両方のオブジェクトでz-Indexプロパティを設定しようとしましたが、これは大きな違いはありません。私は絶対位置と相対位置の両方を試してみました。JQueryモーダルがIE6のリストボックスの上に表示されない

これはIE6でのみ発生します。 IE 7は問題ありませんが、残念ながらIE6ブラウザを使用する必要があります。ここで

は、リストボックス(ListBox)コントロールを含むテーブルからの行の抜粋です:

     <tr style="position: relative; z-index: 80;"> 
          <td colspan="3" style="position: relative; z-index: 80;"> 
           <asp:ListBox ID="lstSites" runat="server" Height="100px" Width="100%" SelectionMode="Multiple" 
            ></asp:ListBox> 
          </td> 
         </tr> 

ここでjQueryの:

<script type="text/javascript"> 

     $(function() { 
      $("#dialog:ui-dialog").dialog("destroy"); 

      $("#helpModal").dialog({ 
       autoOpen: false, 
       height: 250, 
       width: 350, 
       modal: true     
      }); 

      $("#<%= imgHelpIcon.ClientID %>") 

     .click(function() { 
      $("#helpModal").dialog("open"); 
     }); 
     }); 



    </script> 

<%--Help modal s--%> 
<div id="helpModal" class="" title="Help!!" style="z-index: 100;"> 
    <div style="z-index: 300;"> 
     <h4> 
      Help info..... 
     </h4> 
    </div> 
</div> 

誰もが何かを提案することはできますか? IE6でこれに対処するために、私が知っている

おかげ

答えて

3

唯一の方法は、リストボックスを非表示にする(要素を選択)、またはiframe内にポップアップを置くことです。

「ie6 select z-indexバグ」の詳細については、Googleをご覧ください。

+0

をダイアログのshowイベントでオブジェクト(これもそうです)を呼び出し、closeイベントでそれらを再表示します。 – ctorx

2

あなたはおそらくbgiframe回避策

編集に使用したい:私はこの問題を抱えていたとき、私はすべて選択してフラッシュを見つけ、隠すためにjqueryのセレクタを使用することになり HERESに良い答えbgiframe with jQuery UI 1.8.9 Dialog and jQuery 1.5