Sobrepor Iframe com Link dentro do Iframe

[Nilson Machado 0]

Pessoal ...

Tenho esse iframe numa página, linkado para uma página onde tenho uma galeria de fotos.

 

<iframe src="fotos.htm" width="455" height="240" vspace="0" border="0" marginwidth="0" marginheight="0" scrolling="yes" frameborder="0" name="frame_texto" allowtransparency="true"></iframe>

 

Dentro do arquivo "fotos.htm" tenho vários thumbnails para abrir as fotos grandes.

 

O meu problema é que de "dentro" do IFRAME [fotos.htm], não consigo sobrepor o mesmo [iframe] com as fotos grandes ...

As fotos grandes abrem dentro do IFRAME, mesmo usando LAYER por cima do IFRAME.

 

Dentro do arquivo "fotos.htm", usei o seguinte código:

 

<div id="pop" style="display:none;position:absolute;top:0%;left:0%;margin-left:0px;margin-top:0px;width:450px;height:500px;z-index:3;z-order:3"><img src="IMAGEM GRANDE" width="450" height="500" border="0"></div>

<a href="#" onclick="document.getElementById('pop').style.display='block';"><img src="THUMBNAIL DA IMAGEM GRANDE.jpg" width="250" height="170" border="0"></a>

 

 

Resumindo:

Quero sobrepor um IFRAME com LAYER, mas com um link de dentro do IFRAME ...

 

Sobrepor um IFRAME com LAYER na mesma página eu consigo, como nesse modelo abaixo:

 

<iframe src="http://thevoiddesign.kit.net" frameborder="0" width="770" height="300"></iframe>

<div id="l1" style="position:absolute; left:58px; top:104px; width:134px; height:277px; z-index:1; layer-background-color: 0066cc; border: 1px none #000000; background-color: #0066cc;"></div>

 

 

Espero que alguém possa me ajudar ...

 

Grande Abraço ..

 

Nilson

[Fabio Morikawa 0]

essa sua div tem que estar no mesmo nivel do iframe, ou seja, na pagina onde contem o iframe.a div deve conter uma propriedade zindex maior que a do iframe.

[Nilson Machado 0]

Isso eu já testei e deu certo ...Mas eu quero fazer com que isso funcione na página que tá DENTRO DO IFRAME, entendeu ???Você já viu algo assim ?

[Fabio Morikawa 0]

não sei se entendi ... mas va lá...

 

mantem o layer com display:none e id=lay1 e dentro do layer coloque uma img

 

função que deve estar na pagina principal

function photo(img){  var L = document.getElementById('lay1');  L.style.display='block';  L.getELementsByTagName('img')[0].src=img;}

agora de dentro do iframe e só chamar:

 

<a href="#" onclick="parent.photo('foto.jpg')"><img src="thumb.jpg" /></a>

[Nilson Machado 0]

Fabio ...O script tá dando pau nessa linha: L.style.display='block';Mas acho que você entendeu o que eu preciso pra resolver esse probleminha ...Abraço ...Nilson ..

[Fabio Morikawa 0]

não deve estar encontrando a layer

document.getElementById( aqui vai o id da layer );

seu primeiro post esta como l1

<iframe src="http://thevoiddesign.kit.net" frameborder="0" width="770" height="300"></iframe><div id="l1" style="position:absolute; left:58px; top:104px; width:134px; height:277px; z-index:1; layer-background-color: 0066cc; border: 1px none #000000; background-color: #0066cc;"></div>

portanto ficaria assim

function photo(img){  var L = document.getElementById('l1');  L.style.display='block';  L.getELementsByTagName('img')[0].src=img;}

[Nilson Machado 0]

Fábio ...Muito obrigado pela ajuda ...Retirei essa linha do script: L.getELementsByTagName('img')[0].src=img;Ai funcionou perfeitamente ...Valeu mesmo pela força ... Já tava achando que seria impossível de fazer isso ...Grande Abraço ...Nilson ...

[Fabio Morikawa 0]

function photo(img){  var L = document.getElementById('l1');  L.style.display='block';  L.getElementsByTagName('img')[0].src=img;}

Elements

o 'l' é minusculo... era por isso que dava erro