Titre: design menu déroulant de liens
Posté par: wixie le le 14-06-2003 a 04:06:13
hello
j'aimerais savoir comment donner un peu d'allure à une liste de liens dans un menu déroulant
je m'explique: ce fond blanc, cette barre de navigation grise (parfois bleu) immonde, ce noir pour les liens....c'est d'un banal affligeant.
Comment je peux m'y prendre pour changer tout ca?
Voici une partie mon code actuel:
<form name="jump">
<select name="menu" onChange="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">
<option selected>coups de coeurs</option>
<option>*sites*</option>
<option></option>
<option value="....etc....
</select>
</form>
Merci d'une éventuelle réponse! :) |
Titre: Re:design menu déroulant de liens
Posté par: onkr le le 14-06-2003 a 12:10:30
salut,
tu trouveras tout ce qu'il faut à :
http://www.bluejayway.fr.st (Internet Explorer uniquement)
rubrique : design (divers)
...Onkr... :) |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 14-06-2003 a 19:29:07
Merci pour ta réponse. Je suis allée sur le site que tu m'a indiqué, et il me parle de feuille de style a inserer dans les balises <head> </head>. Ce n'est pas vraiment ce que je cherchais. Je voudrais directement placer les codes dans le code du menu déroulant.
J'ai finalement créé un tableau afin de colorer le pourtour du menu, mais le menu déroulant reste déseperement blanc, et les liens noirs.
J'ai essayée d'ajouter <FONT color=...ect... devant la décription des liens, mais rien a faire. Et le fond du menu déroulant je ne sais trop ou rajouter la commande.
Plus clairement: http://wixiesforms.site.voila.fr/test.html
A terme, je compte inserer le code dans une page web existante. |
Titre: Re:design menu déroulant de liens
Posté par: onkr le le 14-06-2003 a 19:36:32
Bonjour,
tu n'as pas dù regarder la bonne page !
exemple ,dans la balise "select" , tu ajoutes :
style="background-color: #336699; color: cyan;"
bien entendu tu modifies les couleurs ...
à+
onkr
|
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 14-06-2003 a 19:54:16
ah oui ca marche! J'avais pas tout suivit, autant pour moi. C'était pas si compliqué que je le pensais finalement.
Merci beaucoup de ton aide en tout cas!!!
wixie:) |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 14-06-2003 a 21:39:23
bon...il y a quelque chose que je ne comprend pas:
Sur ma page de test, tout fontionne, les liens se chargent lorsque l'on clique dessus.
Mais lorsque j'insere le code dans ma page web, ca ne fonctionne pas...! J'ai pourtant bien vérifié les codes, ils sont identiques (mise a part que j'ai supprimé le tableau)
la page concernée: http://www.xanga.com/wixie
Si quelqu'un pouvais jetter un coup d'oeil a la source, parce que je ne vois pas ou est le probleme.
Précision: je ne peux inserer le code que dans le header, la colonne de gauche ne m'est pas accessible.
Désolé de déranger encore... |
Titre: Re:design menu déroulant de liens
Posté par: onkr le le 14-06-2003 a 22:09:29
re,
tes 2 form ont le même (name="jump").
(ps) beaucoup d'erreurs dans ton code , 2 balises "head" et plein de balises inutiles ou imbriquées , si tu veux je te passe la liste (assez longue)que donne "dreamweaver" , avec les n° de ligne.
à+
onkr. |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 14-06-2003 a 22:48:17
Oui c'est le bordel sur cette page! J'ai pas beaucoup de marge de manoeuvre la dessus, a part le header code que je peux modifier et les posts. Et je débute en html, d'ou les erreurs. Si ca te dérange pas de me les envoyer: myblog@voila.fr
Que faut il que je mette a la place de (name="jump") dans le 2ieme form?
|
Titre: Re:design menu déroulant de liens
Posté par: onkr le le 15-06-2003 a 00:33:01
re,
tu mets ce que tu veux (le nom n'a pas d'importance) ce qu'il faut c'est le remplacer partout où il est dans le form .
je t'envoie le fichier.txt
à+
onkr. |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 15-06-2003 a 00:50:21
ok, ca fonctionne maintenant:)
Par contre, je n'arrive pas a faire que les liens s'ouvrent dans une nouvelle fenêtre, malgré le target=_new rajouté apres le lien (exemple: <option value="http://...etc..." target=_new>titre du lien</option>)
Merci pour le fichier, je vais y jetter un coup d'oeil.
|
Titre: Re:design menu déroulant de liens
Posté par: onkr le le 15-06-2003 a 01:19:46
re,
il faut modifier le form et y rajouter un javascript qui indique le target .
tu trouveras un exemple sur mon site "bluejayway" rubrique "pages web" dans les frames ,je crois que c'est "menu deroulant" .
contactes moi si tu n'y arrives pas.
onkr. |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 15-06-2003 a 01:41:28
J'y ai trouvé le code suivant:
<FORM name="guideform">
<p align="center">
<SELECT NAME="guidelinks" onChange="envoie(guideform)">
<OPTION SELECTED VALUE="right.htm">--Choose--</option>
<OPTION VALUE="page1.htm">page 1</option>
<OPTION VALUE="page2.htm">page 2</option>
</SELECT>
<SCRIPT LANGUAGE="JavaScript">
<!--
var target = "rightFrame"
function envoie(guideform){
URL = guideform.guidelinks.options[guideform.guidelinks.selectedIndex].value;
{
parent.frames[target].location = URL;}
}
//-->
</script>
</p>
</FORM>
et euh...j'ai pas tout comprit...faut-il que je modifie tout mon code pour qu'il soit comme celui ci? ou juste faire des modification sur mon code actuel avec certaines de ces fonctions?
De plus, jai deja essayé d'inserer du javascript dans le header mais il n'était pas prit en compte.
|
Titre: Re:mes excuses ....
Posté par: onkr le le 15-06-2003 a 02:39:04
ce script c'est pour les frames ... ;D
voici ton 1er "form" , tu fais le 2eme en t'en inspirant :
<form name="jump">
<select style="background-color: lavender; color: cornflowerblue;" name="menu" onChange="envoie(jump)">
<option selected>:::::::::::coups de coeurs:::::::::::</option>
<option></option>
<option>:::::::::::sites:::::::::::</option>
<option></option>
<option value="http://www.vectorlounge.com">vectorlounge</FONT></option>
<option value="http://www.99x.com">99x</option>
<option value="http://www.ferryhalim.com/orisinal/">orisinal</option>
<option></option>
<option>:::::::::::blogs:::::::::::</option>
<option></option>
<option value="http://mapage.noos.fr/khazad/">khazad's blog</option>
<option value="http://www.u-blog.net/hristou/">hristou</option>
<option value="http://amaud.blogspot.com/">a maud</option>
<option value="http://u-blog.net/aklodd">aklodd</option>
<option value="http://www.theodd.net/">theOdd</option>
<option value="http://www.u-blog.net/unesouffrancepouruneautre">unesouffrancepouruneautre</option>
<option value="http://www.beyondthesunset.fr.fm/">beyondthesunset</option>
<option></option>
<option>:::::::::::clip:::::::::::</option>
<option></option>
<option value="http://www.99x.com/RamFiles/vidpg_BenHarper_WithMyOwn2Hands.ram">with my own 2 hands [b.harper]</option>
</select>
<SCRIPT LANGUAGE="JavaScript">
<!--
function envoie(jump){
URL = jump.menu.options[jump.menu.selectedIndex].value;
{
mywindow = window.open(''+URL+'');
}
}
//-->
</script>
</form>
à+
onkr. |
Titre: Remarque.
Posté par: onkr le le 15-06-2003 a 03:16:44
tu as des options non "selectionnables" (les lignes sans lien)
si on les clique , ça ouvre une fenetre "about:blank" , si tu veux eviter cela , remplace le script par celui-ci :
<SCRIPT LANGUAGE="JavaScript">
<!--
function envoie(jump){
URL = jump.menu.options[jump.menu.selectedIndex].value;
if (jump.menu.value == "")
alert('Faites un choix au menu.')
else {
mywindow = window.open(''+URL+'');
}
}
//-->
</script>
onkr. |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 15-06-2003 a 03:48:54
Tout fonctionne correctement, les liens s'ouvrent dans une nouvelle fenêtre sans probleme.
C'est parfait merci beaucoup j'aurais jamais réussit a faire ca toute seule! :)
wixie
|
Titre: Re:design menu déroulant de liens
Posté par: Jey le le 15-06-2003 a 21:09:15
mon dieu
une invasion de bloggueur ;D |
Titre: Re:design menu déroulant de liens
Posté par: wixie le le 17-06-2003 a 20:56:11
| ah non non j'envahis rien du tout...je fais que passer:) |
Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.
|