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

Menu

mestre fyoda

Perguntado por mestre fyoda,

 Share

Pergunta

8 respostass a esta questão

Posts Recomendados

  • 0
mestre fyoda

mestre fyoda

Postado
  • Autor
Postado

<html>

<head>

<style type="text/css">

.images {background:#c00; width:20px; padding:1px;} /* not part of the menu */

#outer {padding:2px 0; border:1px solid #a50; border-color:#a50 #fa5 #610 #fa5; background:#f2a057 url(grad.gif) repeat-x bottom left; margin:50px 0 100px 0;}

#point {display:table; padding:0; margin:0 auto; list-style:none; white-space:nowrap;}

#point li {display:table-cell; margin:0; padding:0;}

#point li a {float:left; font-family:arial; font-size:0.8em; height:3.1em; line-height:3.1em; letter-spacing:1px; padding:0 1em; text-decoration:none; color:#fff; background:#f2a057 url(grad.gif) repeat-x bottom left; border-right:1px solid #d60; border-left:1px solid #fb6;}

#point li a:hover, #point li a.current {background:#e93 url(down_arrow.gif) no-repeat center top; color:#fff;}

#point li a:hover b, #point li a.current b {display:block; float:left; background:transparent url(up_arrow.gif) no-repeat center bottom; cursor:pointer}

#point li a:focus b, #point li a.current b {display:block; float:left; background:transparent url(up_arrow.gif) no-repeat center bottom; cursor:pointer}

</style>

<!--[if IE]>

<style type="text/css">

#point {display:inline-block;}

#point {display:inline;}

#point li {float:left;}

#outer {text-align:center;}

</style>

<![endif]-->

<link rel="stylesheet" media="all" type="text/css" href="css_play.css" />

<link rel="stylesheet" media="all" type="text/css" href="menus.css" />

</head>

<body>

<div id="outer">

<ul id="point">

<li><a href="index2.html" onclick="this.className='point'" ><b>HOME</b></a></li>

<li><a href="index2.html?current=two"><b>PRODUCTS</b></a></li>

<li><a href="index2.html?current=three"><b>SERVICES</b></a></li>

<li><a class="current" href="index2.html?current=four"><b>PRIVACY</b></a></li>

<li><a href="index2.html?current=five"><b>CONTACT US</b></a></li>

<li><a href="index2.html?current=six"><b>SITE MAP</b></a></li>

</ul>

</div>

</body>

Link para o comentário
Compartilhar em outros sites
  • 0
KaKarotto

KaKarotto

Postado
Postado

você muda o fundo da home para a classe point. Mas a classe "point" não existe, só existe o id "point". O fundo não irá mudar nunca.

Deveria ir para seção javascript, já que isso é javascript.

Link para o comentário
Compartilhar em outros sites
  • 0
mestre fyoda

mestre fyoda

Postado
  • Autor
Postado 

<style>
.glossymenu{
    position: relative;
    padding: 0 0 0 34px;
    margin: 0 auto 0 auto;
    background: url(imagem/menur_bg.gif) repeat-x; /*tab background image path*/
    height: 46px;
    list-style: none;
}

.glossymenu li{
    float:left;
}

.glossymenu li a{
    float: left;
    display: block;
    color:#000;
    text-decoration: none;
    font-family: sans-serif;
    font-size: 13px;
    font-weight: bold;
    padding:0 0 0 16px; /*Padding to accomodate left tab image. Do not change*/
    height: 46px;
    line-height: 46px;
    text-align: center;
    cursor: pointer;    
}

.glossymenu li a b{
    float: left;
    display: block;
    padding: 0 24px 0 8px; /*Padding of menu items*/
}

.glossymenu li.current a, .glossymenu li a:hover{
    color: #fff;
    background: url(imagem/menur_hover_left.gif) no-repeat; /*left tab image path*/
    background-position: left;
}

.glossymenu li.current a b, .glossymenu li a:hover b{
    color: #fff;
    background: url(imagem/menur_hover_right.gif) no-repeat right top; /*right tab image path*/
}


</style>
<div id="maincontainer">

  <div id="topsection"><div class="innertube">   
    <ul class="glossymenu">
        <li class="current"><a href="index.html"><b>Home</b></a></li>
        <li><a href="index.html" onclick="this.className='current'"><b>CSS</b></a></li>
        <li><a href="index.html" onclick="this.className='current'"><b>Forums</b></a></li>    
        <li><a href="index.html" onclick="this.className='current'"><b>Webmaster Tools</b></a></li>    
        <li><a href="index.html" onclick="this.className='current'"><b>JavaScript</b></a></li>    
        <li><a href="index.html" onclick="this.className='current'"><b>Gallery</b></a></li>    
    </ul>
  </div></div>

Eu modifiquei o css, mas quando eu clico não faz nada.

Kakaroto se você souber outro geito para fazer isso me ajude por favor

Link para o comentário
Compartilhar em outros sites
  • 0
KaKarotto

KaKarotto

Postado
Postado

Eu falei pra você ir pra seção Javascript....


<html>
<head>
<link rel="stylesheet" type="text/css" href="css/default.css" media="screen" />

<style>
.current{
 background:orange;
}

.noCurrent{
 background:white;
}


</style>

<script>
window.onload=function(){
 alinks=document.getElementById('ulGlossy').getElementsByTagName('a')
 current=alinks[0]
 for(var x=0; x<alinks.length; x++)
 alinks[x].onclick=function(){
 current.parentNode.className="noCurrent"
 current=this
 this.parentNode.className="current"
 }
}

</script>


</head>
<body>

<style>


</style>
    <ul class="glossymenu" id="ulGlossy">
        <li class="current"><a href="index.html"><b>Home</b></a></li>
        <li><a href="#" ><b>CSS</b></a></li>
        <li><a href="#" ><b>Forums</b></a></li>
        <li><a href="#"><b>Webmaster Tools</b></a></li>
        <li><a href="#" ><b>JavaScript</b></a></li>
        <li><a href="#"><b>Gallery</b></a></li>
    </ul>



</body>
</html>

[/codebox]

Eu postei o javascript aqui, depois eu que vou levar o puxão de oreia dos meus superiores.... <_<

Link para o comentário
Compartilhar em outros sites
  • 0
KaKarotto

KaKarotto

Postado
Postado

Está sim senhor. Se você copiou e colou o que eu fiz ele funcionará. Agora, eu não sei o que está fazendo com o código...

Eu só espero que você não queira trocar de página e ao mesmo tempo deixar as abas com o estilo trocado...Só vai funcionar se você não trocar de página, ou seja, se o atributo href estiver com "#". Se você colocar href="index.htm" lógico que não vai funcionar, a página vai ser novamente "resetada".

Link para o comentário
Compartilhar em outros sites
  • 0
mestre fyoda

mestre fyoda

Postado
  • Autor
Postado (editado)

aqui não foi kakaroto, eu copiei o codigo todo e testei, eu só retirei a linha que apointa pro css/default.css porque eu não tenho .

Testei aqui e cliquei em qualquer um dos links e não deu nada , detalhe eu dei ctrl + c e ctrl + v e não deu certo !

EDITADO -----------------------

Deu certo !

Vlw kakaroto !

Editado por mestre fyoda
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.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

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