modèle de site en css et lien

jopont · Message par **jopont** » 15 avr. 2007, 15:59

Bonjour,

a partir d'un modèle de documents comportant les id content, un header, un left..., comment dire à un lien placé dans le header d'afficher la page dans le left.
Merci de vos explications

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.11) Gecko/20070312 Firefox/1.5.0.11

Message par **chinon37** » 15 avr. 2007, 18:10

Bonjour,

Et dans la langue de Molière et Racine, ça donne quoi?

Mongo Bob · Message par **Mongo Bob** » 15 avr. 2007, 21:01

peut-être qu'on apprendra qu'est-ce que c'est qu'un "left"...

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3

Message par **Ymai** » 15 avr. 2007, 21:09

En gros, ça doit donner qque chose comme:

Code : Tout sélectionner

var AInclure = "patati patata patati patata";
var x = getElementById ("left");
x.innerHtml = AInclure;

Donc, voir la doc sur getElementById et innerHtml
Et, bien sûr, ça ne marche pas si Javascript est désactivé.

Mais je n'ai peut-être pas compris la question.
De toute façon, ceci me semble une question pour le forum "Développement web".
Si un modo passe par là...

jpbardiau · Message par **jpbardiau** » 15 avr. 2007, 21:10

Mongo Bob a écrit :peut-être qu'on apprendra qu'est-ce que c'est qu'un "left"...

Pas de politique ici svp.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3

Mongo Bob · Message par **Mongo Bob** » 15 avr. 2007, 22:43

Je suis époustouflé par la science dont tu fais preuve, Ymai, c'est donc du javascript, pouvait pas le dire dés le départ, jopont?
Cette obscurité de propos sent la manoeuvre politique à plein nez, par ailleurs.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3

Invité · Message par **Invité** » 15 avr. 2007, 23:44

J'ai mis en place un modèle de site avec komposer.
Ce modèle comprend une feuille de style.
Ce modèle met en place les "div id " suivants :
div id = content...
div id =header ...
div id = left ...
div id = left_articles ....

Des liens sont placés dans le "conteneur header "

Je souhaiterais donc que ces liens renvois la page dans le "conteneur left_articles"

désolé de m'être mal expliqué, mais je suis débutant en css et html.
Je vous joins le code de la feuille.
merci

Code : Tout sélectionner

<!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="en"
 lang="en"><head> <meta http-equiv="content-type"
 content="text/html;charset=utf-8" /> <meta name="author"
 content="Luka Cvrk (www.solucija.com)" /> <meta
 name="description" content="My Site" /> <meta
 name="keywords" content="key, words" /> <link
 rel="stylesheet" type="text/css" href="style.css"
 media="screen" /><title>Internet Hosting</title>
</head><body> <div id="content"> <div
 id="left"><div id="header"> <h1>Internet
Hosting</h1> <p>Fast
and reliable hosting for everyone</p> <ul id="tablist">
<li><a href="http://free.fr" accesskey="m"><span
 class="key">M</span>inimum
Package</a></li><li><a href="#"
 accesskey="e">M<span class="key">e</span>dium
Package</a></li><li><a href="#"
 accesskey="p"><span class="key">P</span>remium
Package</a></li><li><a href="#"
 accesskey="c"><span class="key">C</span>ompare</a></li><li><a
 href="#" accesskey="r">P<span class="key">r</span>icing</a></li>
</ul> </div> <div class="border"> <div
 class="subheader"> <p><a href="#">Lorem
ipsum dolor</a> sit amet, consectetuer adipiscing elit, <span
 class="highlight">sed diam nonummy nibh euismod tincidunt ut
laoreet</span> dolore magna aliquam erat volutpat. <span
 class="highlight">Ut wisi enim ad minim veniam</span>,
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex.</p> </div> </div> <div
 class="left_articles"> <h2><a
 name="Reliable_and_Fast_Servers"></a>Reliable and Fast
Servers</h2> <p class="date">Servers monitored 24
hours a day</p> <img class="bigimage"
 src="images/bigimage.gif" alt="Big Image" /> <p><a
 href="#">Lorem ipsum dolor sit amet</a>, consectetuer
adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet
dolore magna aliquam erat volutpat. <a href="#">Ut wisi
enim ad minim veniam</a>, quis nostrud exerci tation ullamcorper
suscipit lobortis nisl ut aliquip ex.</p> <p><a href="#">Lorem
ipsum dolor sit amet</a>, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. <a href="#">Ut wisi enim ad minim veniam</a>,
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut
aliquip ex.</p> </div> <div class="left_box">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed
diam nonummy nibh euismod tincidunt ut laoreet dolore.</p> </div>
<div class="thirds"> <p><b><a href="#"
 class="title">24/7 Ticketing System</a></b><br />Lorem
ipsum dolor sit amet esta pa, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci. <a
 href="#"><img src="images/comment.gif"
 alt="Comment" /></a></p> </div> <div
 class="thirds"> <p><b><a href="#"
 class="title">Free domain with every package</a></b><br />Lorem
ipsum dolor sit amet esta pa, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci. <a
 href="#"><img src="images/comment.gif"
 alt="Comment" /></a></p> </div> <div
 class="thirds"> <p><b><a href="#"
 class="title">cPanel and Helm Administration</a></b><br />Lorem
ipsum dolor sit amet esta pa, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci. <a
 href="#"><img src="images/comment.gif"
 alt="Comment" /></a></p> </div> </div>
<div id="right"> <div class="button"> <p>Special
offer:<br /> <span class="big">$35 / year</span><br />
50MB Linux Package</p> </div><ul id="side_menu">
</ul> <p><span style="text-decoration: underline;"></span></p><p><span
 style="text-decoration: underline;"></span></p><p><span
 style="text-decoration: underline;"></span></p><p><span
 style="text-decoration: underline;"></span></p><p><span
 style="text-decoration: underline;"></span><img
 src="images/image.gif" alt="Image" title="Image"
 class="image" /><b>Lorem ipsum dolor sit amet</b><br />consectetuer
adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet
dolore magna aliquam <a href="#">erat volutpat</a>.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
suscipit lobortis <a href="#">nisl ut aliquip ex</a>.</p>
<br /> <p><img src="images/image.gif" alt="Image"
 title="Image" class="image" /><b>Lorem ipsum
dolor sit amet</b><br />consectetuer adipiscing elit, sed
diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam <a
 href="#">erat volutpat</a>. Ut wisi enim ad minim
veniam, quis nostrud exerci tation ullamcorper suscipit lobortis <a
 href="#">nisl ut aliquip ex</a>.</p> </div>
<div id="footer"> <p class="right">© 2007
Internet Hosting, Design: Luka Cvrk - <a
 href="http://www.solucija.com/"
 title="Information Architecture and Web Design">Solucija</a></p>
<p><a href="#">RSS Feed</a> · <a href="#">Contact</a>
· <a href="#">Accessibility</a> · <a href="#">Products</a>
· <a href="#">Disclaimer</a> · <a
 href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>
and <a href="http://validator.w3.org/check?uri=referer">XHTML</a><br /></p>
</div> </div></body></html>

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.11) Gecko/20070312 Firefox/1.5.0.11

Mongo Bob · Message par **Mongo Bob** » 16 avr. 2007, 08:51

Bon, et bien c'est plus du JS. Merci pour la clarté de ces explications, ça va déjà mieux

.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3

Message par **chinon37** » 16 avr. 2007, 08:54

J'ai l'impression que notre ami veut simplement une ancre en tête de page et des liens qui renvoient vers cette ancre... Me tromperais-je?
dans ce cas, là où tu veux faire ton renvoi, tu mets:

Code : Tout sélectionner

<a name="haut"></a>

et au niveau de ton lien, tu mets:

Code : Tout sélectionner

<a href="#haut">mon lien</a>

ou "haut" est le nom de l'ancre et "mon lien" le texte où se place le lien

Geckozone

modèle de site en css et lien

modèle de site en css et lien

Qui est en ligne ?