4 replies to this topic

[Fábio Chaves]

Estou com um probleminha e não sei que caminho optar para resolvê-lo..
Estou implementando um site em asp, com um menu drop down no topo, em Flash.
Até aqui tudo bem, a questão é que o menu deve estar sempre visivel na tela e, quando clicado, deve sobrepor o restante da página!!

Minha primeira tentativa foi separar a página em 2 frames, num o menu e no outro o restante da página, o que manteria o menu sempre visivel.
Mas desse jeito, não consegui fazer com que o flash aparecesse sobre o frame do corpo da página..
Coloquei o flash com "z-index" superior ao do restante da página e com transparencia, mas não consegui ultrapassar a "fronteira" entre os frames..
Alguém pode me ajudar?!
Coloquei um esboço das tentativas no site.. deêm uma olhada para ilustrar melhor: http://www.projectin...plos/frames.asp

Minha segunda tentativa foi colocar um iframe para abrir o corpo da página e o menu fora desse iframe e sobrepondo-o.
Mas não estou conseguindo fazer com que o menu fique fixo no topo da página..
Acredito que uma das soluções, neste caso, seria definir o height do iframe como >> "window.heigh" - 103px << (sendo 103px = altura do menu)
mas meu conhecimento em javascript é pouco para implementar isso..
Alguém pode me ajudar?!
exemplo: http://www.projectin...plos/iframe.asp

Imaginei uma terceira resolução desse meu dilema, mas essa não me atrevi a implementar pois foge ao meu alcance javascriptico hehehe
Já vi sites com imagens/links que acompanham a tela quando rolada (acho que implementado em javascript)..
se eu fizesse isso com o menu acredito que resolveria meu problema..
Alguém pode me ajudar?!

Bom, agradeço aos bem aventurados que chegaram a ler até aqui meu texto e mais ainda aos que responderem-no.. =]

Obrigado.

[Pharus]

Olá, me casdastrei no forum hoje, e axo que posso responder sua pergunta. XD

O que vc precisa se resume em 2 partes.

1ª - Você precisa alinhas o menu que vc criou em flash Y = 0px;
2ª - Seu código html deve esta numa div, não será necessário de frames para sobrepor:
Código:
width: ; height: ; - tamanho do seu banner.
top: ;left: ; - localização de onde o banner vai ficar
<div style="position:absolute:width: ; height: ;top: ;left: ;z-index:10">
<embed src="" wmode="transparent">
</div>

Explicando.. a div é uma camada q pode ter o tamanho que for se sua posição foi absoluta, não vai alterar os espaçamentos dos demais arquios. o embed vai redimensionar automaticamente a largura e a altura, então é necessári apenas setar o wmode, que faz com que a parte do seu filme que estiver vazia seja transparente.

Protinho... seu swf ja vai sobrepor a página.

[Maykon Beraldo]

Olá, me casdastrei no forum hoje, e axo que posso responder sua pergunta. XD

O que vc precisa se resume em 2 partes.

1ª - Você precisa alinhas o menu que vc criou em flash Y = 0px;
2ª - Seu código html deve esta numa div, não será necessário de frames para sobrepor:
Código:
width: ; height: ; - tamanho do seu banner.
top: ;left: ; - localização de onde o banner vai ficar
<div style="position:absolute:width: ; height: ;top: ;left: ;z-index:10">
<embed src="" wmode="transparent">
</div>

Explicando.. a div é uma camada q pode ter o tamanho que for se sua posição foi absoluta, não vai alterar os espaçamentos dos demais arquios. o embed vai redimensionar automaticamente a largura e a altura, então é necessári apenas setar o wmode, que faz com que a parte do seu filme que estiver vazia seja transparente.

Protinho... seu swf ja vai sobrepor a página.

Boa noite amigo,
É o seguinte, eu estou fazendo um menu horizontal em flash (Adobe Flash CS3) e queria que ficasse como o exemplo a seguir no link: Site Oracle, ou seja, estou criando um menu que ao passar o mouse sobre o um item abrirá um sub-menu e eu queria que este ficasse por cima da página html, como faço isso?

[Kahor]

Amigo,

Nao precisa utilizar somente o flash como ferramenta.

Dê uma olhada aqui: http://maujor.com/tu...l/ddownmenu.php

[Édipo Costa Rebouças]

bem, para mantelo fixo no topo independente do scroll da pagina da pra fazer até sem Javascript, vou tentar explicar rapido com códigos:
HTML:
[codebox]
<body>
<div id="menuflash">
[menu flash aqui dentro]
</div>
<div id="fakebody">
[conteudo que iria dentro do body]
<p>Lorem ipsum dolor sit amet consectetuer turpis Nulla pellentesque pretium rutrum. Vestibulum sed fringilla sagittis urna laoreet Pellentesque diam semper amet Maecenas. Id orci vestibulum nulla sit consequat Vivamus at penatibus Phasellus Maecenas. Tempus tellus cursus ligula tristique In lorem ac augue pretium mattis. Est vitae Nullam lorem Curabitur convallis Nam Vestibulum wisi pretium Donec. Nulla Sed natoque ligula.</p>
<p>Turpis vitae Pellentesque vitae tempus interdum Nullam tincidunt et nibh lorem. A et hendrerit suscipit Curabitur vitae felis turpis dignissim justo tristique. Adipiscing eget fringilla in eget consectetuer ipsum convallis rhoncus enim Maecenas. Nam nonummy nibh lobortis orci Sed vitae montes mauris laoreet dictumst. Porta wisi pede nec quis tellus.</p>
<p>Orci neque id tincidunt Aliquam massa a facilisis id dis tortor. Justo Vestibulum euismod libero mus tempus Phasellus feugiat congue leo vel. Vel nibh elit elit ut et eu massa pulvinar fringilla eros. Dictum enim eget lacus accumsan odio est magna consequat wisi sapien. Ornare feugiat ridiculus lacinia ante neque.</p>
<p>Quisque urna lorem adipiscing Cras a ullamcorper commodo at tortor netus. In ut vitae Sed lacus elit vitae Nam quam Nullam natoque. Feugiat nec in sit diam Morbi lobortis rhoncus amet pretium tincidunt. Nam nulla orci enim vitae et Aenean consectetuer Morbi nulla nibh. Neque congue Curabitur diam urna quis a vel risus vel.</p>
<p>Lorem ipsum dolor sit amet consectetuer turpis Nulla pellentesque pretium rutrum. Vestibulum sed fringilla sagittis urna laoreet Pellentesque diam semper amet Maecenas. Id orci vestibulum nulla sit consequat Vivamus at penatibus Phasellus Maecenas. Tempus tellus cursus ligula tristique In lorem ac augue pretium mattis. Est vitae Nullam lorem Curabitur convallis Nam Vestibulum wisi pretium Donec. Nulla Sed natoque ligula.</p>
<p>Turpis vitae Pellentesque vitae tempus interdum Nullam tincidunt et nibh lorem. A et hendrerit suscipit Curabitur vitae felis turpis dignissim justo tristique. Adipiscing eget fringilla in eget consectetuer ipsum convallis rhoncus enim Maecenas. Nam nonummy nibh lobortis orci Sed vitae montes mauris laoreet dictumst. Porta wisi pede nec quis tellus.</p>
<p>Orci neque id tincidunt Aliquam massa a facilisis id dis tortor. Justo Vestibulum euismod libero mus tempus Phasellus feugiat congue leo vel. Vel nibh elit elit ut et eu massa pulvinar fringilla eros. Dictum enim eget lacus accumsan odio est magna consequat wisi sapien. Ornare feugiat ridiculus lacinia ante neque.</p>
<p>Quisque urna lorem adipiscing Cras a ullamcorper commodo at tortor netus. In ut vitae Sed lacus elit vitae Nam quam Nullam natoque. Feugiat nec in sit diam Morbi lobortis rhoncus amet pretium tincidunt. Nam nulla orci enim vitae et Aenean consectetuer Morbi nulla nibh. Neque congue Curabitur diam urna quis a vel risus vel.</p>
<p>Lorem ipsum dolor sit amet consectetuer turpis Nulla pellentesque pretium rutrum. Vestibulum sed fringilla sagittis urna laoreet Pellentesque diam semper amet Maecenas. Id orci vestibulum nulla sit consequat Vivamus at penatibus Phasellus Maecenas. Tempus tellus cursus ligula tristique In lorem ac augue pretium mattis. Est vitae Nullam lorem Curabitur convallis Nam Vestibulum wisi pretium Donec. Nulla Sed natoque ligula.</p>
<p>Turpis vitae Pellentesque vitae tempus interdum Nullam tincidunt et nibh lorem. A et hendrerit suscipit Curabitur vitae felis turpis dignissim justo tristique. Adipiscing eget fringilla in eget consectetuer ipsum convallis rhoncus enim Maecenas. Nam nonummy nibh lobortis orci Sed vitae montes mauris laoreet dictumst. Porta wisi pede nec quis tellus.</p>
<p>Orci neque id tincidunt Aliquam massa a facilisis id dis tortor. Justo Vestibulum euismod libero mus tempus Phasellus feugiat congue leo vel. Vel nibh elit elit ut et eu massa pulvinar fringilla eros. Dictum enim eget lacus accumsan odio est magna consequat wisi sapien. Ornare feugiat ridiculus lacinia ante neque.</p>
<p>Quisque urna lorem adipiscing Cras a ullamcorper commodo at tortor netus. In ut vitae Sed lacus elit vitae Nam quam Nullam natoque. Feugiat nec in sit diam Morbi lobortis rhoncus amet pretium tincidunt. Nam nulla orci enim vitae et Aenean consectetuer Morbi nulla nibh. Neque congue Curabitur diam urna quis a vel risus vel.</p>
<p>Lorem ipsum dolor sit amet consectetuer turpis Nulla pellentesque pretium rutrum. Vestibulum sed fringilla sagittis urna laoreet Pellentesque diam semper amet Maecenas. Id orci vestibulum nulla sit consequat Vivamus at penatibus Phasellus Maecenas. Tempus tellus cursus ligula tristique In lorem ac augue pretium mattis. Est vitae Nullam lorem Curabitur convallis Nam Vestibulum wisi pretium Donec. Nulla Sed natoque ligula.</p>
<p>Turpis vitae Pellentesque vitae tempus interdum Nullam tincidunt et nibh lorem. A et hendrerit suscipit Curabitur vitae felis turpis dignissim justo tristique. Adipiscing eget fringilla in eget consectetuer ipsum convallis rhoncus enim Maecenas. Nam nonummy nibh lobortis orci Sed vitae montes mauris laoreet dictumst. Porta wisi pede nec quis tellus.</p>
<p>Orci neque id tincidunt Aliquam massa a facilisis id dis tortor. Justo Vestibulum euismod libero mus tempus Phasellus feugiat congue leo vel. Vel nibh elit elit ut et eu massa pulvinar fringilla eros. Dictum enim eget lacus accumsan odio est magna consequat wisi sapien. Ornare feugiat ridiculus lacinia ante neque.</p>
<p>Quisque urna lorem adipiscing Cras a ullamcorper commodo at tortor netus. In ut vitae Sed lacus elit vitae Nam quam Nullam natoque. Feugiat nec in sit diam Morbi lobortis rhoncus amet pretium tincidunt. Nam nulla orci enim vitae et Aenean consectetuer Morbi nulla nibh. Neque congue Curabitur diam urna quis a vel risus vel.</p>
<p>Lorem ipsum dolor sit amet consectetuer turpis Nulla pellentesque pretium rutrum. Vestibulum sed fringilla sagittis urna laoreet Pellentesque diam semper amet Maecenas. Id orci vestibulum nulla sit consequat Vivamus at penatibus Phasellus Maecenas. Tempus tellus cursus ligula tristique In lorem ac augue pretium mattis. Est vitae Nullam lorem Curabitur convallis Nam Vestibulum wisi pretium Donec. Nulla Sed natoque ligula.</p>
<p>Turpis vitae Pellentesque vitae tempus interdum Nullam tincidunt et nibh lorem. A et hendrerit suscipit Curabitur vitae felis turpis dignissim justo tristique. Adipiscing eget fringilla in eget consectetuer ipsum convallis rhoncus enim Maecenas. Nam nonummy nibh lobortis orci Sed vitae montes mauris laoreet dictumst. Porta wisi pede nec quis tellus.</p>
<p>Orci neque id tincidunt Aliquam massa a facilisis id dis tortor. Justo Vestibulum euismod libero mus tempus Phasellus feugiat congue leo vel. Vel nibh elit elit ut et eu massa pulvinar fringilla eros. Dictum enim eget lacus accumsan odio est magna consequat wisi sapien. Ornare feugiat ridiculus lacinia ante neque.</p>
<p>Quisque urna lorem adipiscing Cras a ullamcorper commodo at tortor netus. In ut vitae Sed lacus elit vitae Nam quam Nullam natoque. Feugiat nec in sit diam Morbi lobortis rhoncus amet pretium tincidunt. Nam nulla orci enim vitae et Aenean consectetuer Morbi nulla nibh. Neque congue Curabitur diam urna quis a vel risus vel.</p>
</div>
</body>
[/codebox]
CSS:
[codebox]
html, body{
width: 100%;
height: 100%;
padding: 0;
margin: 0;
overflow: hidden;
}
#fakebody{
position: relative;
width: 100%;
height: 100%;
overflow: auto; overflow-x: scroll; overflow-y: auto;
}
#menuflash{
position: absolute; z-index: 1;
top: 0;
left: 50%;
width: 998px;
height: 50px;
margin-left: -499px; /*metade da largura para centralizar o menu na pagina*/
background-color: red;
}
[/codebox]

op's, respondi a dúvida antiga, a dúvida nova o Kahor deu uma boa resposta.

Attached Files

•  Novo2.zip   1.44KB   3 downloads

Edição feita por: Édipo Costa Rebouças, 18/02/2010, 11:54.