5568 sujets

Sémantique web et HTML

Bonjour,

je suis en train de créer un site internet pour mon école. Je bloque sur un détail tout bête parce que je ne veux pas recharger une nouvelle page à chaque fois et je ne veux pas utiliser de frames.
En faite je veux que lorsque le visiteur clique sur un bouton du menu, la page se charge dans un cadre au dessous du menu, un truc du genre "Target" à l'ancienne.
Est il possible d'utiliser un div en lui donnant un nom? Après dans le lien comment lui dire d'afficher la page dans le cadre et non dans la page entière?
J'espère que vous m'aurez compris. Je peux toujours créer 4 pages identiques avec le texte différent mais c'est pas top.
Je voudrais faire ça vite fait pour avoir du temps par la suite pour faire le site sous spip.
Merci de votre aide.
A+
Ça dépend de ton niveau de compétence en PHP pour includer les contenus dans un élément div, et en JS/Ajax pour ne pas avoir à relaoder la page....
(naturellement tu prendras bien soin de rendre l'historique utilisable, tu afficheras des URL explicites et tu t'assureras qu'un dispositif ad hoc rendra le tout accessible aux UA non-JS)
a écrit :
Ça dépend de ton niveau de compétence en PHP


Si je te dit Nul, ça te va? Smiley rolleyes
Je suis admin réseau de l'école ou je bosse mais je débute en webmastering, après avoir fait mes débuts il y a trés trés longtemps avec du html de base.

En fait je voudrai que tout se fasse sur la même page comme avec l'utilisation de frames mais sans frames. J'ai lu quelque part que cela pouvait être faisable avec un div mais comment dire au lien: si on te clique dessus, tu prend cette page et tu l'affiches dans ce div?
Possible ou pas?

Si c'est trop compliqué, je laisse tomber et je ferai 4 pages identiques avec le texte qui change, ça fait neuneu mais au moins ça me laissera tranquille le temps de faire le site définitif.
Salut Smiley lol
ça tombe super bien, je viens de faire une petite fonction toute simple qui va faire ce que tu veux Smiley cligne .
Dans un fichier JS met ça:
function new_request(){
        var xhr = null;

        if(window.XMLHttpRequest || window.ActiveXObject) {
                if(window.ActiveXObject) {
                        try {
                                xhr = new ActiveXObject("Msxml2.XMLHTTP");
                        } catch(e) {
                                xhr = new ActiveXObject("Microsoft.XMLHTTP");
                        }
                } else {
                        xhr = new XMLHttpRequest();
                }
        } else {
                alert("Votre navigateur ne supporte pas l\'objet XMLHTTPRequest...");
                return null;
        }
 
        return xhr;
}

function load_get(file,variables,id){
	xhr = new_request();
	xhr.open('POST',file,true);
	xhr.onreadystatechange = function(){
        if (xhr.readyState == 4){
            if (document.getElementById) document.getElementById(id).innerHTML = xhr.responseText;
        } else document.getElementById(id).innerHTML = '<p style="text-align: center; margin-top: 50px;"><img src="images/chargement2.gif" alt="Chargement en cours"/></p>';
    }
	xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
	xhr.send(variables);
	return false;
}

Admettons que tu appelleras ce fichier javascript.js.
Dans ta page html dans <head> il faut rajouter la ligne suivante:
<script type="text/javascript" src="javascript.js"></script>

Petite remarque au passage.. Je viens de griller que faire ça c'est un peu bête quand on peut faire ça:
<script type="text/javascript" src="javascript.js" />

Alors pourquoi on préfère le premier au second ? (je sais je sais je viens polluer avec ma question c'est pas bien)

Bref, pour finir tu dois utiliser des liens comme ça:
 <a href="#" onclick="load_get('page_retour.php','variable=contenu&variable2=contenu2', 'id_de_ton_div')">Texte du lien</a>

Donc tu récupères les variables dans page_retour.php avec _POST, ce qu'affichera page_retour.php sera affiché dans le div Smiley cligne .
Je crois qu'il y a un petit bug quand on se retrouve avec " + " dans une variable... ça passe pas le post ! Je sais pas du tout pourquoi, si quelqu'un sait je prend !

Tchaw !
Modifié par uMa-xou (08 Mar 2009 - 11:23)
Salut,
merci pour ces deux réponses, je testerai ça lundi au bureau.
Sinon en xhtml et css pur y a rien de faisable?
Absolument pas, désolé !

Et surtout, je t'en supplie, essaie même pas l'include javascript (j'ai déjà vu des débutants faire ça, je savais même pas quoi dire tellement j'étais horrifié mdr).

Bonne chance.
Modifié par uMa-xou (08 Mar 2009 - 14:52)
Quelle technique utilise donc spip pour arriver à faire cela? Grâce aux squelettes? Mais comment?
Je suis lourd avec mes questions mais j'aimerai comprendre pour apprendre.
Merci.
Afficher quelque chose sur une page sans recharger la page, cherche pas, c'est la solution que j'ai donnée: AJAX.
Salut,

uMa-xou a écrit :
Dans ta page html dans <head> il faut rajouter la ligne suivante:
<script type="text/javascript" src="javascript.js"></script>

Petite remarque au passage.. Je viens de griller que faire ça c'est un peu bête quand on peut faire ça:
<script type="text/javascript" src="javascript.js" />

Alors pourquoi on préfère le premier au second ?
Peut-être parce que d'après les spécifications la balise fermante de l'élément SCRIPT est obligatoire ? Smiley biggol
Hello, plutôt novice en javascript, je suis tombé sur ce code, mais je ne vois pas trop comment le faire fonctionner, au final j'ai une page blanche qui s'affiche. Smiley murf
Je fais bien l'appel au fichier .js, j'ai créé un <div> avec la bonne id, et j'ai recopié le href. Je sais pas trop structurer le php.
Si je sors l'appel au fichier .js la page s'affiche à nouveau correctement...
Faut-il activer un service ajax sur le serveur ?
Un conseil ?
Merci d'avance
uMa-xou a écrit :
Oui.. Et bah justement.. c'est pas-logique mdr.

C'est parfaitement logique. Les éléments qui peuvent avoir un contenu doivent être écrits <balise></balise>, qu'il y ait réellement un contenu entre les deux balises ou pas. Les éléments qui ne peuvent pas avoir un contenu doivent être écrits <balise> (en HTML) ou <balise /> (en XHTML).

Le critère utilisé est donc la nature de l'élément (sa définition formelle), et non pas les conditions de son utilisation dans tel ou tel cas particulier.
manarbre a écrit :
Un conseil ?

Lire des cours et tutoriels de base sur:
1. JavaScript;
2. Ajax.

Ça devrait te prendre entre dix et vingt heures pour acquérir des connaissances de base utilisables. Bonnes lectures et bonne continuation. Smiley smile