Jump to content
Nuno Mateus

abrir links no próprio separador

Recommended Posts

Nuno Mateus

https://www.youtube.com/embed/NAKFvQlDipo?feature=oembed

Pessoal eu estive a seguir este tutorial para fazer um menu, mas não sei como ele faz para abrir os links no separador.

tenho o código todo , só não sei como faz para abrir o link dentro do separador.

código html:

<!DOCTYPE html>

<html>

<head>

<title> Site Menu</title>


<link rel="stylesheet" type="text/css" href="styleMenu.css">


</head>


<body>

<div id="navbar">

<div id="holder">

<ul>

<li> <a href="home.html" id="onlink">home </a> </li>
<li> <a href="produtos.html">produtos</a> </li>
<li> <a href="serviços.html">serviços</a> </li>
<li> <a href="gallery.html">gallery </a> </li>
<li> <a href="contact.html">contact </a> </li>

</ul>

</div> <!--end holderbar-->
</div> <!--end navbar-->
</body>
</html>

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

codigo css:

#navbar
{
width:660px;
}

#navbar #holder
{
height:64px;
border-bottom:1px solid #000;
width:630px;
padding-left:25px;
}

#navbar #holder ul
{
list-style:none;
margin:0px;
padding:0px;
}

#navbar #holder ul li a
{
text-decoration:none;
float:left; /*faz com que os links se vão colocando um após outro até Haver espaço na linha*/
margin-right:5px;
font-family:"Arial Black", Gadjet, sans-serif;
color:#000;
border:1px solid #000;
border-bottom:none; /*anula a borda de baixo posta pelo border*/
padding:20px;
width:75px;
text-align:center;
display:block;
background:#69F;
border-top-left-radius:15px;
border-top-right-radius:15px;
/*border-radius:15px;*/
/*arredonda as partes de cima dos separadores*/
}

#navbar #holder ul li a:hover
{
background:#F90;
color:#FFF;
text-shadow:1px 1px 1px #000;
}

#holder ul li a#onlink
{
background:#FFF;
color:#000;
border-bottom:1px solid #FFF; /*#FFF é branco*/
}

#holder ul li a#onlink:hover
{
background:#FFF;
color:#69F;
text-shadow:1px 1px 1px #000;
}



Obrigado a todos, atenciosamente ,

Nuno Mateus

Edited by Rui Carlos
tags code + geshi

Share this post


Link to post
Share on other sites
HappyHippyHippo

o que queres dizer com separador ? consegues explicar mais concisamente aquilo que pretendes efectuar ?


IRC : sim, é algo que ainda existe >> #p@p

Share this post


Link to post
Share on other sites
Nuno Mateus

O que quero é por ex: aquele separadores tipo site do sapo, onde estão noticias,actualidade,etc..

Assim que mudo de separador aparece uma imagem "link" com uma breve descriçao e ao clicar na imagem , abro a página da noticia.

A parte de abrir a página da noticia eu sei.Não sei é como faço para aparecer a imagem link ao mudar de separado.

EX:

| Noticias | |actualidade|_|desporto| depois carregando desporto | Noticias| |actualidade| |desporto|

| |__ | |_

| Img | img |

| _________| |__________

Muito obrigado Atenciosamente ,

Nuno Mateus

Share this post


Link to post
Share on other sites
HappyHippyHippo

desculpa, mas ainda náo percebi que pretendes ter

- um menu

- um sistema de tabs

- uma outra coisa qualquer

não consegues fornecer um site onde apresenta exactamente o que pretendes ?


IRC : sim, é algo que ainda existe >> #p@p

Share this post


Link to post
Share on other sites
Nuno Mateus

O menu que pretendo é este, sem javascript. Eu tenho esse código aí em cima que me faz os menus, só não sei como fazer para abrir conteúdo , tipo uma imagem ou uma página que eu possa ter na pasta raiz do site, dentro do conteúdo dos separadores.

Atenciosamente,

Nuno mateus

menupronto.gif

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.