site d'architecture

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : site d'architecture

nico2302

Bonjour,
Je suis étudiant en architecture, et je voudrais améliorer mon site.
Je voudrais donc réaliser un menu déroulant
J'ai déja commencer e dessiner les boutons, et le fond du site, mais je ne connais pas grand chose en script.

Je voudrais donc que lorsque je passe dur les bouton, s"affiche un menu déroulant avec les sous catégories.

Pour le moment, j'utilise dreamweaver, mais je n'écris pas directement le code.
Alors je ne sais pas si c'est possible de réaliser ce que je souhaite sans apprendre le CSS ou le javascript? Parce que cela fait deux jours que je cherche, mais je ne trouve que des explication de code CSS. Et je n'y comprends rien dutout.
J'ai essayer de le faire par le code mais bon, je n'y arrive pas du tout.

- est-ce donc possible de faire un menu déroulant sur dreamweaver par exemple, sans utiliser les codes?
- Si c'est impossible, avez vous un lien qui explique vraiment en détail, ce que je souhaite faire, parce que je ne m'en sors pas

Merci d'avance à tous
Nico

Message cité 1 fois
Message édité par nico2302 le 27-04-2010 à 21:42:51

Publicité

nico2302

abais

nico2302 a écrit :

Bonjour,
Alors je ne sais pas si c'est possible de réaliser ce que je souhaite sans apprendre le CSS ou le javascript?

- est-ce donc possible de faire un menu déroulant sur dreamweaver par exemple, sans utiliser les codes?
- Si c'est impossible, avez vous un lien qui explique vraiment en détail, ce que je souhaite faire, parce que je ne m'en sors pas

Merci d'avance à tous
Nico

Bonjour Nico,

Ce que tu demandes relève du CSS ainsi qu'au JS si tu veux que ça "peps" encore plus...
Ce n'est donc pas possible de le faire dans l'interface graphique de Dreamweaver...

Dans tous les cas, tu devra plonger dans le codes, mais ça ne doit pas te faire peur pour autant !!!
Tu peux apprendre le HTML et le CSS avec le siteduzero.com, c'est un très bon tuto qui reprend aux bases de la bases !
L'unique contrainte est le temps à y consacrer... Si t'en a pas de toute façon, on ne peut rien pour toi !

Sinon, il ne s'agit pas de graphisme/webdesign, ton sujet n'est donc pas à sa place...
La sienne est dans Programmation => HTML/CSS/JS

Bonne chance.

Message édité par abais le 24-01-2010 à 00:06:25

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.

nico2302

UN ENORME MERCI
J'ai apris toute la nuit le xhtml et le css, et j'ai réussis a faire mon menu déroulant

merci merci merci

Message édité par nico2302 le 23-01-2010 à 23:52:59

nico2302

voila, j'ai continué mon menu, maintenant que le code est fait, je m'attaque au design :

http://www.hotosting.com/portfolioarchi/index.html

Est-ce que vous n'auriez pas des lien de beau site, ou de tuto pour réaliser de belle barre de menu?
En fait j'aurais bien voulu arriver à un menu comme celui-ci

http://www.pckult.net/tutoriaux

mais bon celui la je pense que c'est du javascript donc...

Sinon, si vous avez des liens pour des idées de barres de menu assez sobre, je suis preneur

abais

C'est du JS en effet... Je t'invite donc à te tourner vers un framework prévu pour, comme JQuery...

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.

nico2302

merci pour ton lien David Boring, mais j'ai depuis un autre problème (je ferai peut-etre mon menu en javascript plus tard car je voudrais avancer un peu dans mon site), avec firefox et pas avec IE. bizare non?

En effet, la div logo ne s'affiche pas dans firefox (celle au dessus du menu) alors que dans IE si.

Comment cela se fait-il?

http://www.hotosting.com/portfolioarchi/index.html

Code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<link rel="stylesheet" media="screen" type="text/css" title="design" href="design.css" />
<style type="text/css">
<!--
.police {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
-->
</style>
</head>
<body>
<div id="logo_logo">
</div>
<div id="menu">
<ul class="niveau1">
<li class="sousmenu"><a class="fleche" href="#">B<span class="bac1">AC</span> 1</a>
<ul class="niveau2">
<li class="autremenu"><a href="#">Cours</a></li>
<li class="sousmenu"><a href="#">Projets</a>
<ul class="niveau3">
<li class="autremenu"><a href="#">Allemagne</a></li>
<li class="autremenu"><a href="#">Luminaire</a></li>
<li class="autremenu"><a href="#">Analyse maison</a></li>
<li class="autremenu"><a href="#">Ecluse</a></li>
<li class="autremenu"><a href="#">Maison canal</a></li>
</ul>
</li>
<li class="autremenu"><a href="#">Travaux</a></li>
</ul>
</li>
<li class="sousmenu"><a class="fleche" href="#">B<span class="bac2">AC</span> 2</a>
<ul class="niveau2">
<li class="autremenu"><a href="#">Cours</a></li>
<li class="sousmenu"><a href="#">Projets</a>
<ul class="niveau3">
<li class="autremenu"><a href="#">Kot-story</a></li>
<li class="autremenu"><a href="#">Central parc</a></li>
<li class="autremenu"><a href="#">Projet 3</a></li>
<li class="autremenu"><a href="#">Projet 4</a></li>
</ul>
</li>
<li class="autremenu"><a href="#">Travaux</a></li>
</ul>
</li>
<li class="sousmenu"><a class="fleche" href="#">B<span class="bac3">AC</span> 3</a>
<ul class="niveau2">
<li class="autremenu"><a href="#">Cours</a></li>
<li class="sousmenu"><a href="#">Projets</a>
<ul class="niveau3">
<li class="autremenu"><a href="#">Projet 1</a></li>
<li class="autremenu"><a href="#">Projet 2</a></li>
<li class="autremenu"><a href="#">Projet 3</a></li>
<li class="autremenu"><a href="#">Projet 4</a></li>
</ul>
</li>
<li class="autremenu"><a href="#">Travaux</a></li>
</ul>
</li>
<li class="sousmenu"><a class="fleche" href="#">M<span class="ma1">A</span> 1</a>
<ul class="niveau2">
<li class="autremenu"><a href="#">Cours</a></li>
<li class="sousmenu"><a href="#">Projets</a>
<ul class="niveau3">
<li class="autremenu"><a href="#">Projet 1</a></li>
<li class="autremenu"><a href="#">Projet 2</a></li>
<li class="autremenu"><a href="#">Projet 3</a></li>
<li class="autremenu"><a href="#">Projet 4</a></li>
</ul>
</li>
<li class="autremenu"><a href="#">Travaux</a></li>
</ul>
</li>
<li class="sousmenu"><a class="fleche" href="#">M<span class="ma2">A</span> 2</a>
<ul class="niveau2">
<li class="autremenu"><a href="#">Cours</a></li>
<li class="sousmenu"><a href="#">Projets</a>
<ul class="niveau3">
<li class="autremenu"><a href="#">Projet 1</a></li>
<li class="autremenu"><a href="#">Projet 2</a></li>
<li class="autremenu"><a href="#">Projet 3</a></li>
<li class="autremenu"><a href="#">Projet 4</a></li>
</ul>
</li>
<li class="autremenu"><a href="#">Travaux</a></li>
</ul>
</li>
<li class="autremenu"><a class="contact_accueil" href="#">C<span class="contact">ONTACT</span></a></li>
<li class="autremenu"><a class="contact_accueil" href="#">A<span class="accueil">CCUEIL</span></a></li>
</ul>
</div>
<div id="bac2_1">
<img src="image/bac2_1.png"/>
</div>
<div id="bac2_2">
<img src="image/bac2_1.png"/>
</div>
</body>
</html>

Code :

body {background: url(image/fond.jpg) top center fixed no-repeat;
background-color:#CCC;}
#logo_logo {
width:910px;
height:50px;
background:url(image/logo.png) no-repeat;
margin:0px auto 10px auto;}
div#menu {
font: 14px Arial, sans-serif;
background-repeat: no-repeat;
width: 910px; height: 40px;
color:#CCC;
margin:auto; padding:0px;border:0;
}
/* div#menu a {color:#000000} ----------------------------INUTILE */
div#menu ul {
margin: 0px;
padding: 0px;
/*width: 980px;*/
border:0;
}
/*On positionne les elements du menu */
div#menu ul li {
position:relative;
list-style: none; /*on enleve les icones de liste */
float:left;border:0;
}
.niveau1{ border:0;padding:0;border:o; }
.niveau1 li { border:O;padding:O;border:O;}
#menu li.sousmenu /* MENU AVEC UN DEROULEMENT */
{
padding:0px;margin-top:2px;margin-bottom:2px;border:0;
height: 36px;
}
#menu li.autremenu /* MENU SANS DEROULEMENT */
{ border:0;padding:0;margin-top:2px;margin-bottom:2px;border:0;
height: 36px;
}
div#menu ul ul {
position: absolute;
display: none;
width: 130px;
border:0;padding:0;margin:0;
}
div#menu li a {
text-decoration: none; /* plus de soulignement pour les liens */
padding: 0px 5px 0px 10px;
display: block;
width: 115px; /* taille du bloc = padding + margin + width */
color:white;
text-align:left;
text-indent: 0px;
line-height: 39px;
/* border-top:1px solid black; */
}
/*choix du fond des menu*/
.contact_accueil { background: url(image/menu.png) repeat-x}
.fleche {background:url(image/fond_fleche_1.png);}
div#menu ul.niveau2 li , div#menu ul.niveau3 li { background: url(image/menu.png);}
/* changement de fond des fleche lorsque la souris est sur BAC1, BAC2, BAC3, MA1 ou MA2 */
.fleche:hover {background:url(image/fond_fleche_2.png)}
/*Lors du survol ,avec la souris, les sousmenu apparaissent grace a display: block */
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2,
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3, .fleche {display:block;}
/*Lors du passage de la souris: choix du fond des menu*/
div#menu ul.niveau1 li a:hover {color:#000}
div#menu ul.niveau1 li.sousmenu a:hover {}
div#menu ul.niveau1 li.autremenu a:hover {}
div#menu ul.niveau2 li.sousmenu a:hover; {}
/* Decalage du niveau 3 avec le niveau 2 */
div#menu ul.niveau3 {
top:-2px; left: 130px; }
/* Taille des span menu */
.bac1 {font: 10px Arial}
.bac2 {font: 10px Arial}
.bac3 {font: 10px Arial}
.ma1 {font: 10px Arial}
.ma2 {font: 10px Arial}
.contact {font: 10px Arial}
.accueil {font: 10px Arial}
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#bac2_1 {
width:920px;
height:238px;
margin: 20px auto 0 auto;
padding: 0px 0 0 10px;}
#bac2_2 {
width:920px;
height:300px;
margin: 20px auto 0 auto;
padding: 0px 0 0 10px;}

abais

apparemment, d'après la coloration syntaxique, ta <div> est en commentaire...
Je ne vois pas trop pourquoi d'ailleurs, tu as bien refermé le commentaire du dessus ainsi que celui d'en dessous...

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.

nico2302

bon bah j'ai retirer les commentaire su dessus et du dessous et sa marche
merci beaucoup abais

Je vous tiens au courant de l'avancée du site

nico2302

http://horta.ulb.ac.be/studentpriv [...] index.html

Bon le site avance petit à petit.
Je voudrais créer un formulaire de contact simple avec nom, prénom email et message. J'ai déja fait des recherche, mais je tombe sur 10 000 façon de faire, et je ne sais pas trop comment tester pour voir si cela fonctionne.

Sais tu comment je peux réaliser un formulaire de contact simple? j'ai déja été sur des site qui génère le code du formulaire, mais je suis pas parvenu a avoir un formulaire de contact simple et efficace.

Message édité par nico2302 le 29-01-2010 à 14:53:36

Publicité

abais

va sur le site du zero, tu as tous ce qui faut pour créer le formulaire (en html) et le traitement (php)...

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.

nico2302

me revoila, j'ai pas mal avancé sur mon site, je voudrais savoir ce que vous en pensiez. il n'est pas encore très rempli mais sa viendra.

Si vous avez des idées pour l'améliorer, je suis preneur

http://horta.ulb.ac.be/studentpubl [...] index.html

Message édité par nico2302 le 28-04-2010 à 00:20:44

leserigraphe

Stop the music and go home

Moi je trouve ca fort sombre... Mais c'est un parti pris

tompouss

Petit chat

je sais pas si c'est le premier mais c'est réussi

chapeau :jap:

---------------
collectionneur de pâtes thermiques

gatsu35

Blablaté par Harko

graphiquement, mais HTMLement parlant :'( :'( :'( :'( :'(

---------------
Blablaté par Harko

nico2302

j'ai jamais eu vraiment de vraix cours, donc je me suis démerdé comme j'ai peu.
Théoriquement, j'étais censé le faire avec dreamweaver, mais bon je me suis dis que j'allais le coder moi même et apprendre le html et css..

Je suppose que ce qui ne va pas, ce sont les tableaux d'images fractionnées? Sinon, a part sa il y a d'autre erreurs?

Skopos

Titilleur de nombrils...

Visuellment oui, le survol des éléments de menu, pas assez contrasté.
(j'ai pas regardé le code)

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

FORUM HardWare.fr

Graphisme

Web design

site d'architecture

Sujets relatifs
Comment coller une texture pour créer un background de site web ?	Comment coller la même image pour réaliser un background de site web ?
Idées pour améliorer le graphisme et l'ergonomie d'un site ?	fond d'écrans site web
Besoin d'avis sur nouveau désign (site photo) maj 05-01-10	Votre avis sur mon site
je cherche un createur de site de salon de tchat pas chers	Site de ressources pour logo
[Avis] Design et architecture de site web
Plus de sujets relatifs à : site d'architecture

Page générée en 0.183 secondes