Ir para conteúdo

POWERED BY:

Arquivado

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

Denis Martos

[Resolvido] Bug de On hover no ie

Por , em Javascript

Recommended Posts

Denis Martos    2

Denis Martos
Postado

Bom meu menu está ficando errado o ahover no IE, porem no FireFox da certo em 1 ele fica de uma cor, no outro fica de outra

 

http://www.pointsquare.com.br/menus.html <<<<O MENU ESTÁ AQUI

 

 

Esse é o codigo...

 

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>CSS Menu - Horizontal</title>

 

<script>

sfHover = function() {

var sfEls = document.getElementById("nav").getElementsByTagName("LI");

for (var i=0; i<sfEls.length; i++) {

sfEls.onmouseover=function() {

this.className+=" sfhover";

}

sfEls.onmouseout=function() {

this.className=this.className.replace(new RegExp(" sfhover\\b"), "");

}

}

}

if (window.attachEvent) window.attachEvent("onload", sfHover);

</script>

<link href="estilomenu.css" rel="stylesheet" type="text/css" media="screen" />

</head>

<body>

<div id="apDiv1">

<table width="100%" border="0" cellpadding="0" cellspacing="0">

<tr>

<td height="4" bgcolor=""></td>

</tr>

<tr>

<td bgcolor="#727172">

<ul id="lec">

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

</li>

<li class="roxoseta"><a href="#" class="roxoseta">Empresa</a>

<ul>

<li><a href="#" class="roxo">Quem Somos</a></li>

<li><a href="#" class="roxo">Imagens</a></li>

<li><a href="#" class="roxo">Clientes</a></li>

</ul>

</li>

<li class="roxoseta"><a href="#" class="roxoseta">Serviços</a>

<ul>

<li><a href="#" class="roxoes">Contruções</a></li>

<li><a href="#" class="roxoes">Elétrica</a></li>

<li><a href="#" class="roxoes">Hidráulica</a></li>

<li><a href="#" class="roxoes">Pintura</a></li>

<li><a href="#" class="roxoes">Reformas</a></li>

<li><a href="#" class="roxoes">Textura</a></li>

<li><a href="#" class="roxoes">Seralheria</a></li>

</ul>

<li class="roxoseta"><a href="#" class="roxoseta">Contato</a>

</li>

</ul></td>

</tr>

</table></div>

 

<div id="apDiv2"></div>

</body>

</html>

 

 

 

AQUI VAI O CSS

 

 

CODE

body {

margin: 0;

background-color: #FFFFFF;

}

#lec {

float:left;

width:auto;

list-style: none;

background: #727172;

padding:0;

margin:0px;

color:#fff;

}

#lec ul {

float: left;

width: auto;

list-style: none;

background: #fff;

padding: 0;

margin: 0 0 1em 0;

font: 12px/16px Verdana, Arial, Helvetica, sans-serif;

}

#lec a {

display: block;

text-decoration: none;

padding: 0.25em 1.9em;

color: #fff; /* cor da fonte do primeiro nível*/

font:11px/15px Verdana, Arial, Helvetica, sans-serif;

border-left:1px solid #a5a2a5; /*barrinhas laterais do menu*/

border-right:1px solid #414142;

}

#lec li {

float:left;

padding:0;

}

#lec li ul {

position: absolute;

left:-999em;

width:14em;

w\idth:13em;

font-weight: normal;

margin:0;

}

#lec li ul a {

width: 13em;

w\idth: 10.2em;

border:0px;

}

#lec li ul ul {margin: -1.75em 0 0 12.9em;}

#lec li:hover ul ul, #lec li.sfhover ul ul, #lec li.sfhover ul ul ul {

left: -999em;

}

#lec li:hover ul, #lec li li:hover ul, #lec li li li:hover ul, #lec li.sfhover ul, #lec li li.sfhover ul, #lec li li li.sfhover ul {left: auto;}

/*====roxo=====*/

#lec a.roxo:hover, #lec li.roxosetadois:hover, #lec li.roxoseta:hover {

font-weight:bold;

background-color: #edb450;

}

#lec a.roxoseta, #lec roxoseta{ width:58px;}

#lec li.roxoseta li, #lec .roxo li{

border:1px solid #edb450;

}

#lec li.roxo ul, #lec li li.roxo ul, #lec li.roxoseta ul{

border:4px solid #edb450;

}

#lec a.roxo {color:#000;}

#lec a.roxoseta {

background:url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

color:#fff;

}

#lec a.roxoseta:hover, #lec a.roxosetadois:hover{

background:#9190f4 url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

font-weight:bold;

}

#lec a.roxosetadois {

background:url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

color:#000;

}

/*====roxo escuro=====*/

#lec a.roxoes:hover, #lec li.roxoessetadois:hover, #lec li.roxoesseta:hover {

font-weight:bold;

background-color: #edb450;

}

#lec a.roxoesseta, #lec roxoesseta{ width:64px;}

#lec li.roxoesseta li, #lec .roxoes li{

border:1px solid #edb450;

}

#lec li.roxoes ul, #lec li li.roxoes ul, #lec li.roxoesseta ul{

border: 4px solid edb450;

}

#lec a.roxoes {color:#000;}

#lec a.roxoesseta {

background:url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

color:#fff;

}

#lec a.roxoesseta:hover, #lec a.roxoessetadois:hover{

background:#9190f4 url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

font-weight:bold;

}

#lec a.roxoessetadois {

background:url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

color:#000;

}

#apDiv1 {

position:absolute;

left:0px;

top:111px;

width:790px;

height:25px;

z-index:1;

}

#apDiv2 {

position:absolute;

left:0;

top:0;

width:790px;

height:107px;

z-index:2;

}

 

 

Preciso muito da ajuda de vocês, esse menu ai eu acher ele meio que pronto na internet em um daqueles sites que fornecem varios codigos prontos

mudei algumas coisas, não sei muito de java e CSS por isso estou pedindo ajuda de vocês !!!

essa ajuda de vocês

Compartilhar este post

Link para o post
Compartilhar em outros sites

Denis Martos    2

Denis Martos
Postado

Depois de muito esforça consegui ^^ vlw ae galera !!!

 

}

#lec a.roxoesseta:hover, #lec a.roxoessetadois:hover{

background:#9190f4 url(file:///E|/Documents and Settings/Denis/Configurações locais/Temporary Internet Files/Content.IE5/5P2STBW3/rightarrow2.gif) 8% 50% no-repeat;

font-weight:bold;

}

 

Aqui está o erro, como eu estava vendo o CSS via DW não aparecia essa cor la para judar não sei pq aonde está a cor background:#9190f4 deveria estar

#edb450 como eu não estava vendo o codigo e sim direto pelo DW no painel de CSS não achei isso hj eu li o codigo inteiro e dei uma estudada nele ai consegui achar o err valw galera

Compartilhar este post

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

Informação importante

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

  Aceito