(Resolvido) Duvida IE e FF

Denis Martos · Março 18, 2008

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[i].onmouseover=function() {
            this.className+=" sfhover";
        }
        sfEls[i].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

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

Denis Martos · Março 18, 2008

Eu estava lendo na internet que o IE ele só aceita o codigo do a:hover dentro de uma tag <a> tem alguma coisa a ver isso?

Denis Martos · Março 19, 2008

}

#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 porque 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

Entrar

(Resolvido) Duvida IE e FF

Pergunta

Denis Martos

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Denis Martos

Link para o comentário

Compartilhar em outros sites

Denis Martos

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades