安卓手机上的fadein div

我试图在javascript的360°全景图片上显示内容的div。它适用于IE，Firefox，Safari，Iphone，Ipad和Android 3（平板电脑），但不适用于android mobile（2.3.3）。安卓手机上的fadein div

从我的全景图我调用一个JavaScript函数来淡入一个绝对位置并显示：无。

这里是JavaScript

function ouvrirDiv(divnum){ 
$('#wrapper'+divnum).fadeIn("slow");} 
function fermerDiv(divnum){ 
    $('#wrapper'+divnum).fadeOut("slow");}

，这里是我的html

<div id="pano"> 
<noscript><table style="width:100%;height:100%;"><tr style="valign:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript> 


<script type="text/javascript"> 
// <![CDATA[ 

    var swf = createswf("nantes.swf", "krpanoSWFObject", "100%", "100%"); 
    swf.addVariable("xml", "nantes.xml"); 
    swf.addParam("wmode","opaque"); 
    swf.embed("pano"); 

// ]]> 

    </script> 
</div> 



<div id="wrapper1"><div id="scroller"> 
<div class="closetop"><a href="javascript:" onClick="fermerDiv(1)">Fermer</a></div> 
<div class="closebottom"><a href="javascript:" onClick="fermerDiv(1)">Fermer</a></div> 
<div id="tabContainer1"> 
    <div class="tabs"> 
     <ul> 
     <li id="tabHeader_1">Texte</li> 
     <li id="tabHeader_2">Photos</li> 
     <li id="tabHeader_3">Vidéos</li> 
     </ul> 
    </div> 
<div class="tabscontent"> 

<div class="tabpage" id="tabpage_1"> 
Texte... 
</div> 

<div class="tabpage" id="tabpage_2"> 
Photos... 
</div> 

<div class="tabpage" id="tabpage_3"> 
Videos... 
</div> 

</div> 

</div> 
</div> 
</div>

而CSS

* { 
margin:0; 
padding:0; 
} 

@media only screen and (min-device-width: 800px) { html { overflow:hidden; } } 
     html { height:100%; } 
     body { height:100%; overflow: hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; -webkit-user-select:none; -webkit-text-size-adjust:none; } 

#pano { 
width:100%; height:100%; position:absolute; top:0px; left:0px; 
} 

#wrapper1 , #wrapper2 , #wrapper3 , #wrapper4 , #wrapper5 { 
    position:absolute; 
    top:0px; bottom:-60px; left:0px; 
    width:100%; 
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.8); 
    overflow:auto; 
    display:none; 
} 

#scroller { 
    position:relative !important; 
    margin:0 auto; 
    -webkit-tap-highlight-color:rgba(0,0,0,0); 
    width:100%; 
    max-width: 600px; 
    background:transparent; 
    color: #fff; 
    margin-bottom: 60px; 
    text-align: justify; 
}

这里是默认的Android浏览器的行为：包装DIV被打开但留在全景后面。在Opera移动设备上，只有在调用包装div后才能滚动全景图，但随后包装纸已经过了全景图（这是正确的），但您无法滚动它，您可以滚动全景图而不是...

我真的不知道这个问题... 如果有人有一个想法，thanx非常多！

测试页有：http://www.360images.fr/nantes/nantes.html

来源

2011-12-29 Jerome Boccon-Gibod