Javascript：切換z-indexed DIVs在IE6/7/8中的可見性

我正在嘗試使用jQuery創建一個簡單的彈出效果，類似於iOS中的彈出窗口。代碼在ff，safari，chrome和ie9中工作得很好，但pop6並沒有出現在ie6-8中。Javascript：切換z-indexed DIVs在IE6/7/8中的可見性

我使用jQuery 1.5.1，以及html5shiv，這樣我可以使用HTML5標籤：

<!--[if lt IE 9]> 
<script src="html5shiv.js"></script> 
<![endif]--> 
<script defer src="jquery.min.js"></script> 
<script defer src="effects.js"></script>

相應的JavaScript代碼：

$(document).ready(function() { 
    $('#button').live('click', function($e) { 
     $e.preventDefault(); 
     $('#popover').fadeToggle('fast'); 

     if ($('#button').hasClass('active')) { 
      $('#button').removeClass('active'); 
     } else { 
      $('#button').addClass('active'); 
     } 
    }); 
});

的相關CSS代碼popover是：

#popover { 
    display: none; 
    position: absolute; 
    top: 43px; 
    left: 5px; 
    z-index: 5000000; 
}

IE是正確添加和刪除類，當我點擊按鈕。另外，當我將popover的CSS更改爲display：block時，當頁面在IE中加載時，popover正確顯示。但是，由於某些原因，IE似乎無法切換div的顯示。我試着把JavaScript代碼放在頁面底部，添加type =「text/javascript」，改變fadeToggle來簡單地顯示，使用getElementById來改變popover的CSS，我想我看過的其他所有解決方案這裏與IE和jQuery相關，點擊（），live（）和/或z-index。

任何想法？

來源

2011-03-30 Junquan

您是否嘗試不使用.live（）？正如在'$（「＃button」）。click（function（）{...}）' – Matthew 2011-03-30 13:40:21

是的，我試圖簡化JavaScript函數一直到： $（'＃button'） .click（function（）{$（'＃popover'）。show（）;}）; 沒有成功 – Junquan 2011-03-30 13:55:04

也許html5shiv.js與它有關，因爲它只加載你的代碼不工作的瀏覽器。你嘗試刪除它嗎？ – Matthew 2011-03-30 14:02:50

我過去使用的解決方案之一是在click事件處添加頁面上的元素。例如，您的情況如下：

$（'＃button'）。live（'click'，function（$ e）{e0.preventDefault（）; $（this）.after（''） ; ... }）;

來源

2011-03-30 14:00:25 Kianosh

由於某些原因，此解決方案在這種情況下似乎不起作用。 – Junquan 2011-03-30 14:28:07

這個想法是這樣的： – Kianosh 2011-03-30 18:07:51

這個想法是當點擊事件發生時添加彈出窗口。所以DOM不包含#popover，一旦點擊事件被調用，你可以在DOM中添加它。您可能不得不讓它知道您要放置的位置，$（this）的使用可能不適合您。如果你需要他們，我可以向你展示一些例子。 – Kianosh 2011-03-30 18:10:18

Javascript：切換z-indexed DIVs在IE6/7/8中的可見性

回答

相關問題