comment utiliser le target vers un div

Version imprimable

22/02/2011, 11h56
la_lvlouche

comment utiliser le target vers un div
Bonjour a tous,
voila j'ai cru comprendre et voir que faire un target vers une div comme ceci:
Code:

1 2 3 4 5 <div id="inscription"> <a href="inscription.php" target=page1>inscription</a> </div> <div id="page1"> </div>
est strictement impossible?
Dans ce cas il doit exister des alternative non? Si vous pouviez me filer un coup de main pour trouver l'une d'entre elles ce serait vraiment sympatique.
Je ne voudrai pas utiliser de frame, si possible rester avec mes div.
22/02/2011, 12h11
Nathanael Marchand

Effectivement ca n'est pas possible. Quel est le but exactement?
22/02/2011, 12h22
la_lvlouche

Le but est de faire lorsque l'on clic dans le menu de gauche par exemple profil utilisateur, que cette page profil.php apparaisse dans le cadre centrale du site.
Comme ici sur le site developpez.net lorsque l'on clic sur Accueil, conception... la page n'est pas completement rechargée.
22/02/2011, 14h03
Nathanael Marchand

Outre le fait qu'on ne soit pas dans le bon forum, ca n'est pas si simple que ca (sinon y'a la solution de la frame aussi). Il faut utiliser du Javascript.
22/02/2011, 14h09
la_lvlouche

Oki seul les frame et le javascript peuvent m'aider...

Alors si vous voulez bien m'expliquer un peu le coté frame ce serait gentil, finalement si c'est cela ou javascript (mon site est deja bien rempli par javascript alors autant etre varier et voir ce que peut me proposer les frame).

Car il me semble que les frame ne font pas bon menage avec les div?
(ayant structuré mon site avec des div... :s)
23/02/2011, 08h04
Bisûnûrs

Sur ce site, si, la page est rechargée complètement. Mais certains navigateurs avec certaines bonnes connexions arrivent à donner cette illusion. Firefox, par exemple, au rechargement de la page ne crée pas de scintillement comme IE. Et avec une bonne connexion Internet, les éléments étant rechargés très vite, ça donne l'impression qu'ils n'ont pas bougé de place.

Il suffit de regarder ce site avec IE pour s'en convaincre.

De plus, l'utilisation de frames est, dans la très grande majorité des cas, à bannir.
23/02/2011, 08h57
Gaetan_

Intéresse toi à la balise iframe qui aura le même avantage que la div te concernant.

Code:

<iframe src="mapage.php" width="x" height="x" name="toto">

Tu peux ainsi avec l'attribut target recharger l'iframe :

Code:

<A HREF="mapage.php?mavariable=X" TARGET="toto">
23/02/2011, 09h05
Bisûnûrs

Mais bien sûr .. Quoi de plus moche pour dénaturer un site, la conception qu'on s'en fait, la sémantique qui va avec, et tuer les derniers espoirs de le voir un jour apparaître dans les moteurs de recherche.
23/02/2011, 12h12
la_lvlouche

Merci Gaetan_, merci Bisûnûrs.
Donc Bisûnûrs tu me conseil de faire recharger la page a chaque clic... en utilisant le javascript ce serai peut être plus simple??
Car si je dois faire 50 fois la même page, ce n'est pas très pratique...

En ce qui concerne les iframes, les frames ce sont les seuls moyens de faire des target? Si oui est ce qu'on peu mettre seul un iframe dans le site? et le reste avec des div ou alors c'est totalement impossible?
23/02/2011, 12h28
Gaetan_

Oui la_lvlouche.
En DIV à ma connaissance c'est impossible.

Bisûnûrs : les iframes sont parfaitement crawlées par les moteurs de recherche.
23/02/2011, 13h57
la_lvlouche

Et concernant la compatibilité div et iframe on oubli? lol
Donc je vais me pencher sur les iframes si ceux ci me permettent de me faire un joli site ;) Merci je reviens voir les reponses de chacun et surement en demandé un peu si j'y arrive pas :p

Citation:

Envoyé par Gaetan_

Oui la_lvlouche.
En DIV à ma connaissance c'est impossible.

Bisûnûrs : les iframes sont parfaitement crawlées par les moteurs de recherche.

Impossible, je n'irai pas jusque la! C'est juste qu'il faut utilise jQuery par exemple!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
 
function SwitchToContent(contentName)
{
        $("div#content").load(contentName);
}
 
</script>
</head>
 
<body>
<div id="menu"><a href="#" onclick="javascript:SwitchToContent('content1.html');">Content 1</a>&nbsp;<a href="#" onclick="javascript:SwitchToContent('content2.html');">Content 2</a></div>
<div id="content">
</div>
</body>
 
</html>

23/02/2011, 14h13
thelvin

Citation:

Envoyé par Gaetan_

Bisûnûrs : les iframes sont parfaitement crawlées par les moteurs de recherche.

Ouaip, mais les liens vers elles, c'est une autre histoire.
Et donc, le moteur de recherche intelligent, il en fait quoi, de ce qu'il a crawlé ? (Le stupide ayant tendance à balancer un lien vers le contenu de la frame, sans son contenant.)

Ce n'est pas qu'une question de moteur de recherche : comment passe-t-on une URL vers une page d'une iframe ? Comment la place-t-on dans son bookmark ?

(Edit : exactement le même problème en JavaScript sauf bricolage supplémentaire, oui, je sais.)
23/02/2011, 14h32
Gaetan_

Je suis d'accord avec toi.

Je réponds simplement à Bisûnûrs qui doutait visiblement de sa prise en compte.

Un site ne se monte pas avec des iframes nous sommes d'accord mais leur utilisation dans ce cadre par exemple est utile, le choix étant à la base limité.

L'idée de la conception parfaite des sites, de la sémantique etc... est dans l'abstrait idéale, le coté ergonomique et fonctionnel n'est pas non plus négligeable.

Citation:

Envoyé par PitMaverick78

Impossible, je n'irai pas jusque la! C'est juste qu'il faut utilise jQuery par exemple!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
 
function SwitchToContent(contentName)
{
        $("div#content").load(contentName);
}
 
</script>
</head>
 
<body>
<div id="menu"><a href="#" onclick="javascript:SwitchToContent('content1.html');">Content 1</a>&nbsp;<a href="#" onclick="javascript:SwitchToContent('content2.html');">Content 2</a></div>
<div id="content">
</div>
</body>
 
</html>

Ceci fonctionne parfaitement ;)
Mais maintenant en lisant les commentaires en dessous, comme celui de thelvin , est ce le meilleur choix possible?

23/02/2011, 16h06
la_lvlouche

Je me suis un peu avancé en croyant que tout allé bien... mais enfait avec la méthode function SwitchToContent(contentName)
Un petit truc me perturbe c'est cette histoire de href="#" <-- ceci n'est pas censé servir d'ancrage?
Puis quand je laisse telle quelle en modifiant pour que ca fonctionne, et bien rien ne s'affiche dans mon div...
Je ne comprend pas trop du coup... si tu peux m'aider? merci d'avance.
23/02/2011, 17h48
Nathanael Marchand

Citation:

Envoyé par la_lvlouche

Je me suis un peu avancé en croyant que tout allé bien... mais enfait avec la méthode function SwitchToContent(contentName)
Un petit truc me perturbe c'est cette histoire de href="#" <-- ceci n'est pas censé servir d'ancrage?
Puis quand je laisse telle quelle en modifiant pour que ca fonctionne, et bien rien ne s'affiche dans mon div...
Je ne comprend pas trop du coup... si tu peux m'aider? merci d'avance.

Alors, la dessus y'a quelques subtilités. le <a href="#" /> signifie que c'est un lien. Effectivement ca va a l'ancre vide de la page courante (donc ca ne fait rien). Si tu ne mets pas de href, le lien n'est pas cliquable, d'où cette ruse!
Apres, pourquoi y'a rien dans ton div... Aucune idée! :D Faudrait débugger avec un outil type Firebug dans Firefox, voir les erreurs d'execution, toussa toussa...
23/02/2011, 22h42
la_lvlouche

Enfait j'utilise actuellement chrome et pas firefox.
M'enfin du coup pour voir ce qui se passe au lieu de faire la fonction normal au clic sur le lien j'ai mis :

Code:

cho "<a href='#' onclick="javascript:alert('ici');"><img src=$sources width='72' height='72'></a>";

étant dans un fichier php j'ai passé la source sous une variable pour me facilité la vie.

Et la ça fonctionne.
23/02/2011, 22h49
la_lvlouche

Désolé c'etait a 100% de ma faute... j'ai mis des ' ' au lieu de " " dans une ligne ce qui a tout faussé!!
Merci ;)

bonjour moi , j'ai justement ce problème
j' ai inserer un iframe dans une div jusque la pas de soucis...
sous ie 8 pas de soucis sous firefoxnon plus mais sous ie6 c'est la cata...

l'iframe est complètement plus bas :-(

codes:
Code:

1 2 3 4 <div id="mainContent">  <iframe id=main src="pag_home.html" width="720" height="510" allowtransparency="0" scrolling="auto" frameborder="0" name="Shelsy" ></iframe> </div>
y a t'il une solution ou l'enlever de la div???

merciiiiiiiiiii