remonter (superposer ?) des images

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : remonter (superposer ?) des images

feudore

Bonjour

Grande débutante en création de site, cela fait des heures que je m'évertue à essayer de comprendre comment remonter des images. Je crois d'ailleurs que je n'ai pas d'autre choix que de les superposer, et je ne sais pas comment faire.
Je m'explique et vous décrit la page :
Tout en haut de l'écran, il y a un bandeau fixe (logo).
Juste en dessous, j'ai eu pour ambition de mettre 5 images qui me servent de menu. Ces images changent quand on passe dessus et qu'on clique avec la souris.
J'ai réussis à créer un code javascript (j'y connais que dalle mais à force de recherche sur le net j'ai réussis à dégoter un générateur de codes javascript qui m'a bien aidée) pour faire cet effet.
Mon problème, c'est que j'aimerais légèrement remonter le bouton menu de droite et celui de gauche pour créer un arrondi.
VSPACE ne fonctionne pas en négatif, alors du coup, je ne sais pas comment faire, surtout qu'il y a plusieurs images, donc je me sens bien perdue.

Voici mon code html :

Code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>JARDISERRE-Accueil-</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="jardiserre" href="jardiserre.css" />
<SCRIPT LANGUAGE="JavaScript">
if(document.images)
{
i651209 = new Image;
i651209 = "images/tomate_clic.jpg";
}
if(document.images)
{
i249058 = new Image;
i249058 = "images/salade_clic.jpg";
}
if(document.images)
{
i494970 = new Image;
i494970 = "images/aubergine_clic.jpg";
}
if(document.images)
{
i887341 = new Image;
i887341 = "images/fraise_clic.jpg";
}
if(document.images)
{
i67436 = new Image;
i67436 = "images/rose_clic.jpg";
}
</SCRIPT>
</head>
<body>
</br>
<p> <div class="logo"> <img class="logo" src="images/logo-final-petite-taille.jpg" alt="logo" /> </div> </p>
<A HREF="accueil.html" onMouseOver="i651209.src='images/tomate_clic.jpg'" onMouseOut="i651209.src='images/tomate_sans_clic.jpg'">
<IMG SRC="images/tomate_sans_clic.jpg" BORDER=0 NAME="i651209" ALT="accueil" HSPACE=4 VSPACE=0></A>
<A HREF="fabrication.html" onMouseOver="i249058.src='images/salade_clic.jpg'" onMouseOut="i249058.src='images/salade_sans_clic.jpg'">
<IMG SRC="images/salade_sans_clic.jpg" BORDER=0 NAME="i249058" ALT="fabrication" HSPACE=4 VSPACE=0></A>
<A HREF="serres.html" onMouseOver="i494970.src='images/aubergine_clic.jpg'" onMouseOut="i494970.src='images/aubergine_sans_clic.jpg'">
<IMG SRC="images/aubergine_sans_clic.jpg" BORDER=0 NAME="i494970" ALT="serres" HSPACE=4 VSPACE=0></A>
<A HREF="conseils.html" onMouseOver="i887341.src='images/fraise_clic.jpg'" onMouseOut="i887341.src='images/fraise_sans_clic.jpg'">
<IMG SRC="images/fraise_sans_clic.jpg" BORDER=0 NAME="i887341" ALT="conseils" HSPACE=4 VSPACE=0></A>
<A HREF="contact.html" onMouseOver="i67436.src='images/rose_clic.jpg'" onMouseOut="i67436.src='images/rose_sans_clic.jpg'">
<IMG SRC="images/rose_sans_clic.jpg" BORDER=0 NAME="i67436" ALT="contact" HSPACE=4 VSPACE=0></A>

Je vous remercie par avance de vos lumières...

Publicité

OLEV

Citation :

Mon problème, c'est que j'aimerais légèrement remonter le bouton menu de droite et celui de gauche pour créer un arrondi.

Il n'y a pas de boutons dans ton code, juste des liens (href). Je pense que tu fais reference aux liens.
Je ne suis par ailleurs par certain d'avoir tres bien compris ton probleme, mais en supposant quand meme que si, je dirais que tu peux parvenir a l'effet desire en t'aidant des tableaux (<table></table> ) et en reglant l'alignement vertical de tes liens a l'interieur des cellules.

feudore

Merci de ta réponse OLEV.
Si tu avais juste un exemple d'application, ça m'aiderait beaucoup.

OLEV

Tes liens sont actuellement sur une seule ligne.
Si tu souhaite les mettre en forme avec plus de precisions, tu dois les mettre dans un tableau html.

Code :

<table>
<tr>
<td>Ton lien</td>
<td>Ton lien2</td>
<td>Ton lien3</td>
</tr>
</table>

Les reglage plus fin peut ensuite se faire pour obtenir avec des valign pour regler l'alignement vertical, mais je pense qu'en mettant juste un <br /> juste avant les liens "centraux" (donc ni le premier, ni le dernier) tu devrais obtenir un pseudo effet d'arrondi comme tu le recherche.

Encore une fois, sous reserve d'avoir bien compris ce que tu souhaites.

aspirateur

Non n'utilise pas les tableaux pour faire de la mise en forme, c'est pas un bon conseil.

Utilise la mise en forme avec une feuille de style, d'autant plus que tu en a déjà une : jardiserre.css

Pour le code html, il te suffit de créer une liste <ul>

Code :

<ul id="menu">
<li><a href="">ton image</a></li>
<li><a href="">ton image</a></li>
<li><a href="">ton image</a></li>
</ul>

Ensuite tu va dans ta feuille de style et tu applique un style à la liste "menu"

Il existe pleins de tutos qui t'expliqueront ca, par exemple : http://css.mammouthland.net/menu-horizontal-en-css.php

Essaye d'avancer la dessus et poste ton nouveau code, on te filera un coup de main si tu bloque.

feudore

Merci pour vos réponses. Je vais tester tout ça prochainement, et je vous tiens au courant. A bientôt

FORUM HardWare.fr

Programmation

HTML/CSS

remonter (superposer ?) des images

Sujets relatifs
Comment acquerir des images via Twain avec IE and FF?	VBA - Userform - Pb de superposition des images et des labels
script pour afficher des images de webcam	Superposer des div dans des div
utilitaire de traitement d'images avec java	Problème CSS : Espace non désiré d'origine inconnue sous les images
Pb hero slide jquery images	Générer un mur d'images aléatoires?
Faire remonter une valeur dans une page	insertion des images
Plus de sujets relatifs à : remonter (superposer ?) des images

Page générée en 0.087 secondes