2013-06-22 40 views
0

我試圖清理我的CSS和JavaScript,我走得太遠了。雖然這段代碼適用於Chrome瀏覽器和Firefox,但在IE10中卻很瘋狂。 http://jsfiddle.net/alexnode/y4y4A/1/按鈕上的透明覆蓋div觸發器不起作用在IE 10中

<div id="bgmbutton1"> 
     <img id="button1" src="http://translationgames.org/images/button1overlay.png" alt="Translation games"> 
     <img id="obutton1" src="http://translationgames.org/images/button1.png" alt="Translation games"> 
     <div id="otrigger1" class="button" data-case="translation"></div> 
    </div> 

#bgmbutton1 { 
    position: fixed; 
    left: 2%; 
    top: 5%; 
} 
#button1 { 
    width: 25%; 
} 
#obutton1 { 
    width: 25%; 
    position: absolute; 
    top:0; 
    left:0; 
} 
#otrigger1 { 
    height:100%; 
    width:100%; 
    position: absolute; 
    left: 0; 
    top: 0; 
    cursor: pointer; 
    z-index:5000; 
} 

任何想法?我確信我正在做一些非常基本的錯誤事情。

回答

2

http://jsfiddle.net/alexnode/y4y4A/8/

#bgmbutton1{position: fixed; 
    left: 2%; 
    top: 5%; 
    } 
#button1 {width: 25%;} 
#obutton1 {width: 25%;position: absolute;top:0;left:0;} 
#otrigger1 {background:rgba(0,0,0,0); height:100%; width:100%; position: absolute; left: 0; top: 0; cursor: pointer; z-index:5000;} 

您應該添加背景:RGBA(0,0,0,0);創建一個不可見的透明疊加觸發器。 檢查上面的小提琴。