IE滾動條+溢出滾動+ div上的

Question

我有兩個div。一個div（副本）將css overflow屬性設置爲auto。其他div（覆蓋）位於頂部。我無法更改這兩個div的z-index，因爲視覺上覆蓋圖需要位於副本的頂部。在IE9中，'copy'div的滾動條不可點擊/可用。在Chrome中，它正常工作，因爲我正在使用pointer-events屬性。我怎樣才能讓這個例子在IE9中工作？我需要能夠滾動內容。

CSS

#overlay{ 
    width:400px; 
    height:200px; 
    position:absolute; 
    display:block; 
    background-color:#990000; 
    z-index:2; 
    opacity:.2; 
    pointer-events:none; 
} 
#copy{ 
    overflow:auto; 
    width:300px; 
    height:200px; 
    position:absolute; 
    overflow-y: scroll; 
    overflow-x: hidden; 
    z-index:1; 

}

HTML

<div id="overlay"></div> 
<div id="copy">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in felis elit. Mauris elementum mi non mauris euismod interdum. Morbi auctor velit lacinia augue vehicula vel egestas tortor scelerisque. Sed quis arcu massa, quis elementum ligula. Nunc et quam id ipsum consequat ullamcorper.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in felis elit. Mauris elementum mi non mauris euismod interdum. Morbi auctor velit lacinia augue vehicula vel egestas tortor scelerisque. Sed quis arcu massa, quis elementum ligula. Nunc et quam id ipsum consequat ullamcorper.</div> 

在這裏看到一個例子： http://jsfiddle.net/7w4Jh/1/

記住，例如工作在WebKit瀏覽器的罰款。這個問題只發生在Internet Explorer（9）

Answer 1

這是因爲您的z-index設置爲#overlay，以便位於副本的頂部，防止底層的#copy接收鼠標事件。通過切換每個z-index，它工作得很好。

此外，您不需要聲明所有三個overflow屬性。這就足夠了：

overflow:hidden; 
overflow-y:scroll; 

只是一個領導。

Answer 2

pointer-events（CSS pointer-Events To Allow Clicks On Underlying Elements）在IE瀏覽器不工作..

我發現：

forwarding-mouse-events-through-layers/

和

http://jsbin.com/uhuto