Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Arrasted

Nao Aparecer o Hover

Por , em Desenvolvimento frontend

Recommended Posts

Arrasted    0

Arrasted
Postado

body {margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-color: #DEF3CA; background-image: url(); background-repeat:no-repeat}

 

#Fundo{position:absolute; background-color:#FFFFFF; border-right:1px solid #94CE63; left:0px; top:0px; width:778px; height:100%; z-index:1}

#Up{position:absolute; background-color:#FFFFFF; border-bottom:1px solid #94CE63; left:0px; top:0px; width:777px; height:75px; z-index:2}

#Header{position:absolute; left:0px; top:76px; width:778px; height:133px; z-index:3}

#Img{position:absolute; left:0; top:208px; width:778px; height:32px; background-image:url(imgs/barra_menu.jpg); background-repeat:no-repeat; z-index:4}

/*---------------------------------------------------------------------------------------------------------------------------------------------------*/

 

ul{position:absolute; margin:0; top:241px; padding:0; list-style:none; width:148px}

 

ul li{position:relative}

 

li ul{position:absolute; left:0px; top:245px; display:none}

 

ul li a{display:block; text-decoration:none; font-family:Verdana, Arial, Helvetica; font-size:10px; color:#444444; background-color:#CDEAB3; padding:5px; border:1px solid #94CE63; border-bottom:0}

 

/* Fix IE. Hide from IE Mac \*/

* html ul li{float:left}

* html ul li a{height:1%}

/*FIM*/

 

ul{margin:0; padding:0; list-style:none; width:148px; border-bottom:1px solid #94CE63}

li:hover ul{display:block}

li:hover ul li.over ul{display:block; background-color:#F0F0F0; color:#444444}

/* Fix IE. Hide from IE Mac \*/

* html ul li{float:left; height:1%}

* html ul li a{height:1%}

/*End/

---------------------------------------------------------------------------------------

 

<script type="text/javascript">

startList = function() {

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

navRoot = document.getElementById("nav");

for (i=0; i<navRoot.childNodes.length; i++) {

node = navRoot.childNodes;

if (node.nodeName=="LI") {

node.onmouseover=function() {

this.className+=" over";

}

node.onmouseout=function() {

this.className=this.className.replace

(" over", "");

}

}

}

}

}

window.onload=startList;

</script>

 

--------------------------------------------------------------

 

<html>

<head>

<title> [ PIN - Programa Integrado de Nutrição ] </title>

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

<style type="text/css">

@import "Main.css";

</style>

<script type="text/javascript" src="Main.js"></script>

</head>

 

<body>

 

<div id="Fundo">

 

<div id="Up">

</div><!-- Up -->

 

<div id="Header">

<img src="imgs/photo_reader.jpg" height="133" border="0">

</div>

<!-- Header -->

 

<div id="Img">

</div><!-- Img -->

 

<ul id="nav">

<li><a href="#">Home</a></li>

<li><a href="#">About</a>

<ul>

<li><a href="#">History</a></li>

<li><a href="#">Team</a></li>

<li><a href="#">Offices</a></li>

</ul>

</li>

<li><a href="#">Services</a>

<ul>

<li><a href="#">Web Design</a></li>

<li><a href="#">Internet Marketing</a></li>

<li><a href="#">Hosting</a></li>

<li><a href="#">Domain Names</a></li>

<li><a href="#">Broadband</a></li>

</ul>

</li>

<li><a href="#">Contact Us</a>

<ul>

<li><a href="#">United Kingdom</a></li>

<li><a href="#">France</a></li>

<li><a href="#">USA</a></li>

<li><a href="#">Australia</a></li>

</ul>

</li>

</ul>

 

</div><!-- Fundo -->

 

</body>

</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

renanfog    0

renanfog
Postado

<ul id="nav"> tem q englobar todo o menu...pq no IEca, ele varre todos os filhos dele e criam o efeito do hover... olha o tutorial de novo q você vai perceber...falou :D

Compartilhar este post

Link para o post
Compartilhar em outros sites

tiagoborges.net    0

tiagoborges.net
Postado

Comedia, quando li achei que era o hover referente ao estilo do link, mas parece que o hover é referente ao mostrar o menu.

 

http://forum.imasters.com.br/public/style_emoticons/default/upset.gif

 

Que será mesmo que ele quer???

Compartilhar este post

Link para o post
Compartilhar em outros sites

Arrasted    0

Arrasted
Postado

Pesquisei muito Pessoal, e muitos indicam para á página de onde tirei o tuto, o menu na condição hover deveria mostrar um sub-menu do lado direito.Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

renanfog    0

renanfog
Postado

cara, eu nem tive mto tempo de olhar, mas vi q você adaptou errado o CSS

colei o original q tem no www.maujor.com e deu certinho

da uma olhada no original e ve o q você fez de errado:

 

body {	font: normal 11px verdana;	}ul {	margin: 0;	padding: 0;	list-style: none;	width: 150px; /* Width of Menu Items */	border-bottom: 1px solid #ccc;	}ul li {	position: relative;	}	li ul {	position: absolute;	left: 149px; /* Set 1px less than menu width */	top: 0;	display: none;	}/* Styles for Menu Items */ul li a {	display: block;	text-decoration: none;	color: #777;	background: #fff; /* IE6 Bug */	padding: 5px;	border: 1px solid #ccc;	border-bottom: 0;	}/* Fix IE. Hide from IE Mac \*/* html ul li { float: left; height: 1%; }* html ul li a { height: 1%; }/* End */ul li a:hover { color: #E2144A; background: #f9f9f9; } /* Hover Styles */  li ul li a { padding: 2px 5px; } /* Sub Menu Styles */  li:hover ul, li.over ul { display: block; } /* The magic */

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

pow cara, eh q você naum escreveu nada, naum postou nenhuma referencia online pra gente ver o q q tah acontecendo... ae fica dificil... a gente naum sabe o q você quer e eh obrigado a copiar e colar tudo pra gente primeiro ver o q q tah acontecendo, pra depois, tentar resolver... poste um texto, sua duvida, etc antes do post... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito