menu CSS et XHTML..

KexS · 10 Mai 2006

Bonjour,

J'ai trouvé un menu déroulant horizontal qui va très bien avec mon site et qui correspond exactement à ce que je recherchai. Le seul problème est que j'aimerai bien avoir une cible _blank pour les liens, que ça soit ceux des menus ou des sous-menus..

Savez vous où je pourrais modifier ça dans le code car je n'y connais absolument rien!

Le code ( j'ai l'horizontale ) : http://css.alsacreations.com/Construction-...l-et-horizontal

Merci d'avance!

KexS

EDIT : C'est bon j'ai trouvé comment faire! ++

Modifié 10 Mai 2006 par KexS

Compte supprimé · 10 Mai 2006

Une petite remarque : rien de plus pénible que de briser la navigation en ouvrant de nouvelle fenêtres... Laisse l'internaute le faire si il le veut mais ne lui impose pas. Merci

KexS · 10 Mai 2006

Le truc c'est que je veux mettre des liens vers des pages vraiment anexes comme par exemple un formulaire où il faudra de toute façon quitter la fenêtre après le "Merci pour votre message" , ou pour agrandir une photo dans une liste de photo, alors je vais pas faire quitter le site à l'internaute alors que je suis sur qu'il voudra revenir dessus.. c'est pas mieux de faire une page qu'il fermera une fois qu'il en aura plus besoin et en dessous de laquelle il retrouvera son site adoré?

Modifié 10 Mai 2006 par KexS

jeanpierre949 · 12 Mai 2006

sauf s'il ferme la mauvaise fenetre

real34 · 13 Mai 2006

Peut-être que sur ce coup-ci dans ce cas là il peut être intéressant d'utiliser le window.open de javascript ...

Sinon, pour ce qui est du formulaire, il te suffit de rediriger le visiteur vers ta page d'accueil une fois le formulaire validé.

oxerrois · 15 Mai 2006

J'avais adapté le code de ce menu sur un design, pour mon usage, si ça peut t'aider.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xml:lang="fr" lang="fr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>_________</title>

<script type="text/javascript">
<!--
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script>

<style type="text/css">
.header {
background-color:#3174ac;
width:764px;
height:130px;
}

#conteneur {
position: absolute;
width:764px;
}
#centre {
width:764px;
}
a {
color:#f6b70d;
}

a:hover {
color:#FF0000;
}

body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 0;
left: 0;
z-index:100;
width: 100%; /* précision pour Opera */
}
#menu dl {
float: left;
width: 12em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background:#2d6391;
border: 1px solid gray;
margin: 1px;
}
#menu dd {
display: none;
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background:#2d6391;
}
#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray; 
}
.fondcentre {
background-color:#009e01;
width:764px;
height:300px;
font-family;"Trebuchet MS", Verdana, "Lucida Grande", Tahoma, Helvetica, Sans-Serif;
font-size:14px;
background-color:#3174ac;
}
.pied {
background-color:#000000;
width:764px;
height:15px;
color:#ffffff;
font-family:"Trebuchet MS", Verdana, "Lucida Grande", Tahoma, Helvetica, Sans-Serif;
font-size:10px;
}
</style>
</head>
<body>
<div class="header">
</div>
<div id="conteneur">
<div id="menu">
	<dl>
		<dt onmouseover="java script:montre();"><a href="" title="Retour à l'accueil">Accueil</a></dt>
	</dl>
	<dl>			
		<dt onmouseover="java script:montre('smenu1');">Menu 1</dt>
			<dd id="smenu1">
				<ul>
					<li><a href="#">Sous-Menu 1.1</a></li>
					<li><a href="#">Sous-Menu 1.2</a></li>
					<li><a href="#">Sous-Menu 1.3</a></li>
					<li><a href="#">Sous-Menu 1.4</a></li>
					<li><a href="#">Sous-Menu 1.5</a></li>
					<li><a href="#">Sous-Menu 1.6</a></li>
				</ul>
			</dd>
	</dl>
	<dl>	
		<dt onmouseover="java script:montre();"><a href="">Menu 2</a></dt>
	</dl>
	<dl>	
		<dt onmouseover="java script:montre('smenu3');">Menu 3</dt>
			<dd id="smenu3">
				<ul>
					<li><a href="#">Sous-Menu 3.1</a></li>
					<li><a href="#">Sous-Menu 3.2</a></li>
					<li><a href="#">Sous-Menu 3.3</a></li>
					<li><a href="#">Sous-Menu 3.4</a></li>
					<li><a href="#">Sous-Menu 3.5</a></li>
				</ul>
			</dd>
	</dl>
	<dl>	
		<dt onmouseover="java script:montre('smenu4');">Menu 4</dt>
			<dd id="smenu4">
				<ul>
					<li><a href="#">Sous-Menu 4.1</a></li>
					<li><a href="#">Sous-Menu 4.2</a></li>
					<li><a href="#">Sous-Menu 4.3</a></li>
				</ul>
			</dd>
	</dl>
</div>
<div id="centre">
<div class="fondcentre">
</div>
</div>
<div class="pied">
 © Tous droits reservés à Pierre Matel
</div>

</div>

</body>
</html>

Bon courage

Pierre

Connexion

menu CSS et XHTML..

Sujets conseillés

KexS

Compte supprimé

KexS

jeanpierre949

real34

oxerrois

Veuillez vous connecter pour commenter

Parcourir

Activité