Ir para conteúdo
Fórum Script Brasil
  • 0

Menu Popup: Tipo Texto(cód.) X Tipo Imagem(export.)


Guest - s_ric_ptbrasil -

Pergunta

Guest - s_ric_ptbrasil -

Quero fazer um menu popup somente com textos e não imagens do tipo, vá no fireworks crie uma imgem para menu e adicionar menu popup.

Quero fazer menu popup somente no dreamweaver. Tem como? Alguém conhece algum material para que eu possa dar uma estudada(tutorial, artigo, etc...)?

Agradeço desde já.

Link para o comentário
Compartilhar em outros sites

13 respostass a esta questão

Posts Recomendados

  • 0
Guest - s_ric_ptbrasil -

Deixa ver se entendi. Faço uma página com os textos que vão ser o submenu e salvo como popup.htm e linko esta página com o texto(menu do submenu ) da página que tem o menu principal.

Estou certo?

Link para o comentário
Compartilhar em outros sites

  • 0
Guest - s_ric_ptbrasil -

Eu fiquei meio confuso com a explicação, daí procurei algo sobre isso e descobri um link que fala sobre Pop-it menu e é feito com script, cheguei fazer uns testes e deu certo, só uma coisa que não consegui fazer é deixar os textos do submenu centralizado. Se alguém puder ajudar vou deixar o script que fiz.

Agradeço desde já.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>Documento sem t&iacute;tulo</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">

#popitmenu{

position: absolute;

background-color: #01537E;

border:0px solid black;

font: normal 10px Verdana;

line-height: 18px;

z-index: 100;

visibility: hidden;

}

#popitmenu a{

text-decoration: none;

padding-left: 6px;

color: #FFFFFF;

display: block;

}

#popitmenu a:hover{ /*hover background color*/

background-color: #FFCC00;

}

</style>

<script type="text/javascript">

/***********************************************

* Pop-it menu- © Dynamic Drive (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit http://www.dynamicdrive.com/ for full source code

***********************************************/

var defaultMenuWidth="105px" //set default menu width.

var linkset=new Array()

//SPECIFY MENU SETS AND THEIR LINKS. FOLLOW SYNTAX LAID OUT

linkset[0]='<a href="comercial.htm">Comercial</a>'

linkset[0]+='<a href="suporte.htm">Suporte</a>'

linkset[0]+='<a href="rh.htm">Oportunidades</a>'

linkset[1]='<a href="teste1.htm">teste 1</a>'

linkset[1]+='<a href="teste2.htm">teste 2</a>'

linkset[1]+='<a href="teste3.htm">teste 3</a>'

linkset[1]+='<a href="teste4.htm">teste 4</a>'

////No need to edit beyond here

var ie5=document.all && !window.opera

var ns6=document.getElementById

if (ie5||ns6)

document.write('<div id="popitmenu" onMouseover="clearhidemenu();" onMouseout="dynamichide(event)"></div>')

function iecompattest(){

return (document.compatMode && document.compatMode.indexOf("CSS")!=-1)? document.documentElement : document.body

}

function showmenu(e, which, optWidth){

if (!document.all&&!document.getElementById)

return

clearhidemenu()

menuobj=ie5? document.all.popitmenu : document.getElementById("popitmenu")

menuobj.innerHTML=which

menuobj.style.width=(typeof optWidth!="undefined")? optWidth : defaultMenuWidth

menuobj.contentwidth=menuobj.offsetWidth

menuobj.contentheight=menuobj.offsetHeight

eventX=ie5? event.clientX : e.clientX

eventY=ie5? event.clientY : e.clientY

//Find out how close the mouse is to the corner of the window

var rightedge=ie5? iecompattest().clientWidth-eventX : window.innerWidth-eventX

var bottomedge=ie5? iecompattest().clientHeight-eventY : window.innerHeight-eventY

//if the horizontal distance isn't enough to accomodate the width of the context menu

if (rightedge<menuobj.contentwidth)

//move the horizontal position of the menu to the left by it's width

menuobj.style.left=ie5? iecompattest().scrollLeft+eventX-menuobj.contentwidth+"px" : window.pageXOffset+eventX-menuobj.contentwidth+"px"

else

//position the horizontal position of the menu where the mouse was clicked

menuobj.style.left=ie5? iecompattest().scrollLeft+eventX+"px" : window.pageXOffset+eventX+"px"

//same concept with the vertical position

if (bottomedge<menuobj.contentheight)

menuobj.style.top=ie5? iecompattest().scrollTop+eventY-menuobj.contentheight+"px" : window.pageYOffset+eventY-menuobj.contentheight+"px"

else

menuobj.style.top=ie5? iecompattest().scrollTop+event.clientY+"px" : window.pageYOffset+eventY+"px"

menuobj.style.visibility="visible"

return false

}

function contains_ns6(a, B) {

//Determines if 1 element in contained in another- by Brainjar.com

while (b.parentNode)

if ((b = b.parentNode) == a)

return true;

return false;

}

function hidemenu(){

if (window.menuobj)

menuobj.style.visibility="hidden"

}

function dynamichide(e){

if (ie5&&!menuobj.contains(e.toElement))

hidemenu()

else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))

hidemenu()

}

function delayhidemenu(){

delayhide=setTimeout("hidemenu()",500)

}

function clearhidemenu(){

if (window.delayhide)

clearTimeout(delayhide)

}

if (ie5||ns6)

document.onclick=hidemenu

</script>

</head>

<body>

<a href="#" onMouseover="showmenu(event,linkset[0])" onMouseout="delayhidemenu()">Contate-nos</a>

| <a href="#" onMouseover="showmenu(event,linkset[1], '150px')" onMouseout="delayhidemenu()">News

sites</a>

</body>

</html>

Link para o comentário
Compartilhar em outros sites

  • 0
Guest - s_ric_ptbrasil -

Este script que eu passei no post anterior funcionou quando eu copiei e colei numa página html em branco.Até aí é fácil, mas eu fui fazer este script funcionar na página pra valer ele não funcionou. Aconteceu uma coisa inusitada, quando passei o mouse em cima para testar o submenu não apareceu e layout que eu tinha feito em tabela ele desceu junto com o acontecido. Eu acho que a tabela ou o iframe embaixo deve ter escondido o sobmenu, eu não sei, estou chutando.

O que eu posso fazer? Qualquer ajuda é bem vinda.

Link para o comentário
Compartilhar em outros sites

  • 0
Guest - s_ric_ptbrasil -

Esquece tudo o que eu falei. Já resolvi o problema. O que aconteceu é esqueci de copiar um ítem do script, por isso estava desconfigurado, mas agora está ok.

Valeu pela força.

Link para o comentário
Compartilhar em outros sites

  • 0

é facil fácil...

vai no DW e cria uma tabela que serão seus links raiz....

faz o link deles pra #

ex.: <a href="#">menu1</a>

clica no link e vai na janela behaviors (window / behaviors)

clique no + e escolha a opção Show Pop-up Menu

e vai criando os intens do menu!!

qualquer duvida posta aí =***

Link para o comentário
Compartilhar em outros sites

  • 0
Guest - s_ric_ptbrasil -

Jaquelinerz, eu fiz da maneira que você me ensinou e deu certo, mas uma coisa não me agradou quando testei no browser. Acontece que o texto que você linka com "#" não substitui o menu, ou seja, aparece o texto linkado, o menu e o submenu. Não tem como substituir o texto linkado pelo criado(menu). Desta forma que estou falando, vai aparecer só o menu e o submenu. Entendeu o que quis dizer?

Link para o comentário
Compartilhar em outros sites

  • 0

bom... pelo que entendi você não quer que o link do menu tenha "cara de link" é isso!?!?

simples... vai lá no seu código e retira o href="#" o resto é só css ^^"

ex:

seu código está assim

<a href="#" name="link2" id="link2" onmouseover="MM_showMenu(window.mm_menu_1206171012_0,43,16,null,'link2')" onmouseout="MM_startTimeout();">
ele vai ficar assim
<a name="link2" id="link2" onmouseover="MM_showMenu(window.mm_menu_1206171012_0,43,16,null,'link2')" onmouseout="MM_startTimeout();">

=***

Link para o comentário
Compartilhar em outros sites

  • 0
Guest - s_ric_ptbrasil -

Quando dá um refresh no DW para testar acontece o seguinte. o texto que é o link, aparece, mas quando passa o mouse em cima ele substitui com cara menu. Até aí tudo bem, mas o que quero é quando sua página html é aberta no browser não apareça o texto e sim ele já com cara de menu.

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...