Boas pessoal! Sendo este o meu primeiro post neste forum devo dizer que este forum está muito porreiro! Passando ao meu problema. Eu tenho 2 div's, uma com alguma transparencia outra que contem uma imagem. O meu objectivo seria mostrar a div com a imagem por cima da div transparente! Isto no FF,chrome e opera funciona as mil maravilhas!Agora no IE (sou principiante e já odeio o IE lol) a imagem "aparece" mas fica escondida! Eu não a vejo mas se carregar com o rato na zona que ela era suposto estar visível consigo guardar no meu pc e visualizar a foto sem problemas. declaração das divs div que contem a foto
<div onclick = 'showclose();' class='divfoto' id='divshowfoto'><img style='border:0px solid #FFF;'id='imagemDentroDiv' /></div>
div transparente
<div onclick='showclose();' id = 'divTransparente' class='rounded-box'>
<!-- Corners -->
<div class='top-left-corner'>
<div class='top-left-inside'>
bull
</div>
</div>
<div class='bottom-left-corner'>
<div class='bottom-left-inside'>
bull
</div>
</div>
<div class='top-right-corner'>
<div class='top-right-inside'>
bull
</div>
</div>
<div class='bottom-right-corner'>
<div class='bottom-right-inside'>
bull
</div>
</div>
<!-- Content -->
<div class='box-contents'>
</div> <!-- end div.box-contents -->
</div> <!-- end div.rounded-box -->
Estilos
.divfoto
{
position:absolute;
visibility:hidden;
display:none;
z-index:1000;
border:10px solid red;
filter:alpha(opacity=1);
-moz-opacity:1;
khtml-opacity:1;
opacity:1;
}
div.rounded-box {
background-color: #333222;
margin: 3px;
position:absolute;
display:none;
visibility:hidden;
width:580px;
height:600px;
filter:alpha(opacity=50);
-moz-opacity:0.5;
khtml-opacity:0.5;
opacity:0.5;
z-index:99;
}
div.top-left-corner, div.bottom-left-corner,
div.top-right-corner, div.bottom-right-corner
{
position:absolute;
width:20px;
height:20px;
background-color:#FFF;
overflow:hidden;
}
div.top-left-inside, div.bottom-left-inside,
div.top-right-inside, div.bottom-right-inside
{
position:relative;
font-size:150px;
font-family:arial;
color: #333222;
line-height: 40px;
}
div.top-left-corner
{
top:0px;
left:0px;
}
div.bottom-left-corner
{
bottom:0px;
left:0px;
}
div.top-right-corner
{
top:0px;
right:0px;
}
div.bottom-right-corner
{
bottom: 0px;
right:0px;
}
div.top-left-inside
{
left:-8px;
}
div.bottom-left-inside
{
left:-8px; top:-17px;
}
div.top-right-inside
{
left:-25px;
}
div.bottom-right-inside
{
left:-25px; top:-17px;
}
div.box-contents {
position: relative; padding: 8px; color:#000;
}
codigo js
function showBig(foto){
var divTransparente = document.getElementById('divTransparente'); //div transparente
var divfoto= document.getElementById('divshowfoto'); //div que contem a foto
var imagemDentroDiv = document.getElementById('imagemDentroDiv'); //a imagem
//mostrar div transparente
divTransparente.style.display='inline';
divTransparente.style.visibility = 'visible';
//div que contem a foto
divfoto.style.display='inline';
divfoto.style.visibility = 'visible';
//tratar a foto directametne
// imagemDentroDiv.style.display='block';
// imagemDentroDiv.style.visibility='visible';
//tratar o caminho da foto
var newimg = new Image();
var pathArrayFoto = explode('/',foto);
newimg.src = 'imagens/large/'+pathArrayFoto[pathArrayFoto.length-1];
//tratar o tamanho da div que contem a imagem
divfoto.style.width = newimg.width;
divfoto.style.height= newimg.height;
//adicionar o caminho da foto ao tag imagem
imagemDentroDiv.src = newimg.src;
} Espero ter explicado o suficiente do meu problema se for preciso mais alguma coisa digam sff. De certeza que isto é uma solução rapida, mas sendo eu ainda um pequeno noob no js não consigo dar com o problema e vinha aqui pedir uma ajudinha! Obrigado