覆蓋圖像蒙板不適用於摩托羅拉Xoom（安卓4.0.4）

Question

我測試我們的網站，發現在Android 4.0.4中，圖像不再被正確屏蔽。

由於沒有應用於彈出圖像的遮罩，因此它被黑色背景覆蓋。

這似乎是相關的CSS代碼，它從「查看大」鏈接觸發。任何幫助故障排除這將不勝感激：

.overlay { 
    background:none; 
    display:none; 
    position:absolute; 
    z-index:9999999; 
    text-align:left; 
    font-size:11px; 
    color:#565656; 
    font-family:Arial, Helvetica, sans-serif; 
    -moz-box-shadow: 3px 3px 10px #000; 
    -webkit-box-shadow: 3px 3px 10px #000; 
    box-shadow: 3px 3px 10px #000; 
    } 

.overlay #close-overlay { 
width:62px; 
height:30px; 
cursor:pointer; 
position:absolute; 
background: url(../wwwasmeorg/media/images/button-close-overlay.gif) 10px 0px no-repeat #000; 
font-size:12px; 
color:#fff; 
top:-30px; 
right:0px; 
line-height:30px; 
padding-left:40px; 
    } 

    .overlay #overlay-img { 
    } 

    .overlay .caption { 
padding:10px 0px; 
color:#fff; 
opacity:.8; 
font-size:13px; 
background:#242424; 
    } 

    .overlay .caption p { 
padding:0 7px; 
    } 

    .overlay .cart-overlay { 
background:#fff; 
float:left; 
padding:35px 40px 40px 40px; 
width:380px; 
font-size:16px; 
line-height:21px; 
text-align:center; 
    } 

    .overlay .cart-overlay .buttons { 
margin-left:40px; 
_margin-left:20px; 
margin-top:30px; 
    } 

    .overlay .cart-overlay .buttons .blue-button { 
margin-right:15px; 
    } 

    .overlay .cart-overlay.error .buttons .blue-button { 
margin-left:120px; 
_margin-left:60px; 
    } 

    .overlay .cart-overlay .buttons .green-button { 
margin-top:-4px; 
    } 

    #overlay-landing.overlay { 
    background:#000; 
    opacity:.6; 
    } 

    #overlay-blocker { 
    background:#000000; 
    left:0; 
    opacity:0.7; 
    position:absolute; 
    top:0; 
    width:100%; 
    z-index:999999; 
    } 

    #overlay-blocker iframe { 
    width: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    filter : alpha(opacity = 0); 
    z-index: 9999; 
    } 

    #overlay-blocker { 
    filter: alpha(opacity = 70); 
    } 

    #overlay-blocker #overlay-loading { 
background:url(../wwwasmeorg/media/images/ajax-loader.gif) 0px 0px no-repeat; 
height:16px; 
width:16px; 
position:absolute; 
    } 

    #overlay-content { 
    position:relative; 
    } 

Answer 1

這是我的理解是安卓4.0.4對CSS3圖像蒙的支持比較差。你可能在你的CSS中沒有問題。