Html
Fermé
hamdico
Messages postés
4
Date d'inscription
mardi 21 juin 2011
Statut
Membre
Dernière intervention
12 juillet 2011
-
8 juil. 2011 à 15:58
coeus Messages postés 3019 Date d'inscription samedi 13 janvier 2007 Statut Membre Dernière intervention 19 juin 2013 - 12 juil. 2011 à 14:55
coeus Messages postés 3019 Date d'inscription samedi 13 janvier 2007 Statut Membre Dernière intervention 19 juin 2013 - 12 juil. 2011 à 14:55
A voir également:
- Html
- Editeur html - Télécharger - HTML
- Html download - Télécharger - HTML
- /Var/www/html/index.html ✓ - Forum Linux / Unix
- &Nbsp html ✓ - Forum Webmastering
- [HTML] - á et les autres - Forum HTML
4 réponses
thevinou
Messages postés
1007
Date d'inscription
lundi 28 février 2011
Statut
Membre
Dernière intervention
10 mars 2015
190
8 juil. 2011 à 16:05
8 juil. 2011 à 16:05
Il faut créer une div qui possède ton contenu, la mettre en hidden, et lors d'un clic, avec un peu de javascript, tu retire le hidden de ta div, qui va donc apparaitre
coeus
Messages postés
3019
Date d'inscription
samedi 13 janvier 2007
Statut
Membre
Dernière intervention
19 juin 2013
119
8 juil. 2011 à 18:06
8 juil. 2011 à 18:06
Salut !
Tu ne peux pas faire ça uniquement en HTML. Il va te falloir aussi un peu de CSS et de Javascript.
Le CSS, ça sert à définir comment ton HTML va s'afficher. Le Javascript, c'est le langage qui va régir les actions : qui va définir ce qui se passe quand tu cliques quelque part, quand tu appuies sur un bouton, etc.
Voici un exemple de HTML qui combine les trois :
Ça devrait fonctionner... Prends en note cependant, ce que je te donne là est du HTML très "sale". Tu vas devoir te renseigner sur le CSS et le Javascript, et assez vite tu vas pouvoir faire des scripts plus propres.
Bonne chance !!!
Tu ne peux pas faire ça uniquement en HTML. Il va te falloir aussi un peu de CSS et de Javascript.
Le CSS, ça sert à définir comment ton HTML va s'afficher. Le Javascript, c'est le langage qui va régir les actions : qui va définir ce qui se passe quand tu cliques quelque part, quand tu appuies sur un bouton, etc.
Voici un exemple de HTML qui combine les trois :
<div><a onmouseup="document.getElementById('liste').style.display='block';">Afficher</a></div>
<ul id="liste" style="display:none;">
<li>Un</li>
<li>Deux</li>
<li>Trois</li>
<li><a onmouseup="document.getElementById('liste').style.display='none';">Cacher</a></li>
</ul>
Ça devrait fonctionner... Prends en note cependant, ce que je te donne là est du HTML très "sale". Tu vas devoir te renseigner sur le CSS et le Javascript, et assez vite tu vas pouvoir faire des scripts plus propres.
Bonne chance !!!
hamdico
Messages postés
4
Date d'inscription
mardi 21 juin 2011
Statut
Membre
Dernière intervention
12 juillet 2011
8 juil. 2011 à 16:16
8 juil. 2011 à 16:16
je suis débutante en html (just je fais des modification sur des pages web qui sont déja créés par autrui) , je n'assimile pas votre réponce , priére de m'exipliquer mieu avec exemple si possible ( les balises à utiliser????) mérci
hamdico
Messages postés
4
Date d'inscription
mardi 21 juin 2011
Statut
Membre
Dernière intervention
12 juillet 2011
11 juil. 2011 à 10:10
11 juil. 2011 à 10:10
merci coeus , mais prière de m'expliquer encors ça : où doit on écrire le code css et le javascript??? en fait ,dans ton exemple ,où est le code css et le javascript???
coeus
Messages postés
3019
Date d'inscription
samedi 13 janvier 2007
Statut
Membre
Dernière intervention
19 juin 2013
119
11 juil. 2011 à 15:00
11 juil. 2011 à 15:00
Pour le CSS, tu as deux choix :
Soit tu crées un fichier nom_de_fichier.css que tu mets quelque part dans l'arborescence de ton site, et dans le <head> de ta page HTML, tu rajoutes la balise suivante pour les lier :
Ou alors, carrément, dans ta page HTML, tu crées une balise <style> et tu mets ton code CSS dedans.
Pour des exemples, regarde ici.
Pour le Javascript, c'est à peu près pareil. Tu peux te créer un fichier nom_de_fichier.js qui contient ton code Javascript. Tu mets ensuite cette balise dans ton fichier HTML (Moi je te conseille de la mettre entre ton </body> et ton </html>, mais tu peux aussi le mettre dans ton <head>, c'est plus propre) :
Ou alors, tu crées une balise <script type="text/javascript"> dans ton fichier HTML (là, ça se met un peu n'importe où, sauf entre certaines balises HTML spéciales) et tu mets ton JS dedans.
Exemples ici.
Le Javascript, tu peux l'appeler à partir de ton HTML. Par exemple, disons que tu as un élément <p>, auquel tu veux créer un événement : tu veux que, quand on clique dessus, ça t'affiche une alerte qui te dit "Hello !". Tu peux donc faire :
Il existe d'autres événements qui peuvent être détectés : un double-clic, la pesée sur une touche du clavier, etc. Regarde ici pour un peu plus de détails sur les événements.
Aussi, plus pratique quand l'événement à déclencher, tu pourrais faire :
Et, dans ton <head> (ou ailleurs), tu définis une fonction sayHello :
Donc, en gros, sur un clic sur ta balise de paragraphe, ça va invoquer la fonction sayHello(), et faire tout ce qui est contenu dedans.
Je te donne beaucoup d'infos d'un coup, tu as donc le choix de pousser plus loin ou d'intégrer seulement ce qui est nécessaire pour ton projet actuel... Mais si tu continues dans cette branche, ce sera très vite un must de maîtriser tout ça.
N'hésite pas si tu as d'autres questions, je suis un peu parti dans tous les sens, tu me diras si certains problèmes attirent plus ton attention ! ;-)
Soit tu crées un fichier nom_de_fichier.css que tu mets quelque part dans l'arborescence de ton site, et dans le <head> de ta page HTML, tu rajoutes la balise suivante pour les lier :
<link rel="stylesheet" type="text/css" href="chemin/vers/nom_de_fichier.css" />
Ou alors, carrément, dans ta page HTML, tu crées une balise <style> et tu mets ton code CSS dedans.
Pour des exemples, regarde ici.
Pour le Javascript, c'est à peu près pareil. Tu peux te créer un fichier nom_de_fichier.js qui contient ton code Javascript. Tu mets ensuite cette balise dans ton fichier HTML (Moi je te conseille de la mettre entre ton </body> et ton </html>, mais tu peux aussi le mettre dans ton <head>, c'est plus propre) :
<script type="text/javascript" src="chemin/vers/nom_de_fichier.js"></script>
Ou alors, tu crées une balise <script type="text/javascript"> dans ton fichier HTML (là, ça se met un peu n'importe où, sauf entre certaines balises HTML spéciales) et tu mets ton JS dedans.
Exemples ici.
Le Javascript, tu peux l'appeler à partir de ton HTML. Par exemple, disons que tu as un élément <p>, auquel tu veux créer un événement : tu veux que, quand on clique dessus, ça t'affiche une alerte qui te dit "Hello !". Tu peux donc faire :
<p onmouseup="alert('Hello !');">Clique ici.</p>
Il existe d'autres événements qui peuvent être détectés : un double-clic, la pesée sur une touche du clavier, etc. Regarde ici pour un peu plus de détails sur les événements.
Aussi, plus pratique quand l'événement à déclencher, tu pourrais faire :
<p onmouseup="sayHello();">Clique ici.</p>
Et, dans ton <head> (ou ailleurs), tu définis une fonction sayHello :
<script type="text/javascript">
function sayHello() {
alert("Hello !");
}
</style>
Donc, en gros, sur un clic sur ta balise de paragraphe, ça va invoquer la fonction sayHello(), et faire tout ce qui est contenu dedans.
Je te donne beaucoup d'infos d'un coup, tu as donc le choix de pousser plus loin ou d'intégrer seulement ce qui est nécessaire pour ton projet actuel... Mais si tu continues dans cette branche, ce sera très vite un must de maîtriser tout ça.
N'hésite pas si tu as d'autres questions, je suis un peu parti dans tous les sens, tu me diras si certains problèmes attirent plus ton attention ! ;-)
hamdico
Messages postés
4
Date d'inscription
mardi 21 juin 2011
Statut
Membre
Dernière intervention
12 juillet 2011
12 juil. 2011 à 10:29
12 juil. 2011 à 10:29
salut coeus,
j'ai encore des questions : je vai ecrire mon code comme ça :
<p onmouse="affiche();">portail </p>
puis:
<script type="text/javascript">
fonction affiche()
{
????
}
</style>
ce que je veux avoir est :
en clicant sur le mot "portail" ,on aura une liste contenant 2 choix:"smart1" et "smart2" ; chaque choix présente un lien vers une autre page web
1 question : je ne maitrise pas le java : si c possible donne moi cette partie de code (????) en java
2 question : ce code est -t-il correcte??
merci merci merci .....
j'ai encore des questions : je vai ecrire mon code comme ça :
<p onmouse="affiche();">portail </p>
puis:
<script type="text/javascript">
fonction affiche()
{
????
}
</style>
ce que je veux avoir est :
en clicant sur le mot "portail" ,on aura une liste contenant 2 choix:"smart1" et "smart2" ; chaque choix présente un lien vers une autre page web
1 question : je ne maitrise pas le java : si c possible donne moi cette partie de code (????) en java
2 question : ce code est -t-il correcte??
merci merci merci .....
coeus
Messages postés
3019
Date d'inscription
samedi 13 janvier 2007
Statut
Membre
Dernière intervention
19 juin 2013
119
12 juil. 2011 à 14:55
12 juil. 2011 à 14:55
Hey hey hey ! :-)
Petite correction amicale avant de commencer : Ce n'est pas du Java, c'est du Javascript. Je ne vais pas dans le détail, mais si tu veux regarde sur Wiki, y a une énorme différence. Just so you know ;-)
Ton code est correct, appart deux petite fautes d'orthographe :
1. Ce n'est pas onmouse="affiche();" mais onmouseup="affiche();" ;
2. Ce n'est pas fonction affiche() { mais function affiche() { (Eh oui, que veux-tu, l'anglais, toujours l'anglais !!!)
Appart ça, pour afficher/cacher des éléments, le plus facile est de faire une fusion de Javascript et de CSS. En CSS, tu as l'attribut display qui peut être mis à block, inline, inline-block, none, etc.
Référence rapide ici pour CSS : display
Donc pour changer le display d'un élément via Javascript, il faut d'abord que l'élément cible (un <ul>, dans ton cas) soit identifié par un ID. Rien de plus simple :
Ensuite, tu vas aller "chercher" cet ID avec Javascript dans ta fonction affiche(), et tu vas définir son style de manière à ce que ce soit visible :
Et ensuite tu n'auras plus qu'à faire un autre bouton ou hyperlink, où tu voudras, qui appellera la fonction cacher(), servant évidemment à mettre un display:none; sur ton <ul> :
Et voilà !!! :-D
Dis-moi comment tout ça évolue !
Petite correction amicale avant de commencer : Ce n'est pas du Java, c'est du Javascript. Je ne vais pas dans le détail, mais si tu veux regarde sur Wiki, y a une énorme différence. Just so you know ;-)
Ton code est correct, appart deux petite fautes d'orthographe :
1. Ce n'est pas onmouse="affiche();" mais onmouseup="affiche();" ;
2. Ce n'est pas fonction affiche() { mais function affiche() { (Eh oui, que veux-tu, l'anglais, toujours l'anglais !!!)
Appart ça, pour afficher/cacher des éléments, le plus facile est de faire une fusion de Javascript et de CSS. En CSS, tu as l'attribut display qui peut être mis à block, inline, inline-block, none, etc.
Référence rapide ici pour CSS : display
Donc pour changer le display d'un élément via Javascript, il faut d'abord que l'élément cible (un <ul>, dans ton cas) soit identifié par un ID. Rien de plus simple :
<ul id="id_quelconque">...</ul>
Ensuite, tu vas aller "chercher" cet ID avec Javascript dans ta fonction affiche(), et tu vas définir son style de manière à ce que ce soit visible :
function affiche() {
document.getElementById("id_quelconque").style.display = "block";
}
Et ensuite tu n'auras plus qu'à faire un autre bouton ou hyperlink, où tu voudras, qui appellera la fonction cacher(), servant évidemment à mettre un display:none; sur ton <ul> :
function cacher() {
document.getElementById("id_quelconque").style.display = "none";
}
Et voilà !!! :-D
Dis-moi comment tout ça évolue !
