Onglets dans une page web
Fermé
Martial
-
3 juin 2012 à 02:35
lili34500 Messages postés 178 Date d'inscription lundi 11 février 2008 Statut Membre Dernière intervention 17 août 2012 - 6 juin 2012 à 08:28
lili34500 Messages postés 178 Date d'inscription lundi 11 février 2008 Statut Membre Dernière intervention 17 août 2012 - 6 juin 2012 à 08:28
A voir également:
- Onglets dans une page web
- Supprimer une page word - Guide
- Traduire une page web - Guide
- Web office - Guide
- Restaurer onglets chrome - Guide
- Capture page web - Guide
7 réponses
lili34500
Messages postés
178
Date d'inscription
lundi 11 février 2008
Statut
Membre
Dernière intervention
17 août 2012
16
3 juin 2012 à 10:38
3 juin 2012 à 10:38
C'est un site fixe ou dynamique (html ou php) ?
C'est un site pratiquement fixe pas dynamique. Il y a effectivement du PHP mais les scripts concernés ne sont utilisés que pour certaines pages spécifiques (comme la rubrique contact ou visioconfértence). Ces PHP n'ont absolument rien en rapport avec la page web ou je souhaite mettre ces "onglets" (si je peux les appeler ainsi.
lili34500
Messages postés
178
Date d'inscription
lundi 11 février 2008
Statut
Membre
Dernière intervention
17 août 2012
16
3 juin 2012 à 12:18
3 juin 2012 à 12:18
pour ce systeme il vaux mieux utiliser jQuery
ok un exemple de code:
ok un exemple de code:
///JQUERY
//importe jquery...
<script>
$(document).ready(function(){
$('#contenu1').hide();
$('#contenu2').hide();
$('#contenu3').hide();
$('#titre1').click(function(){
$('#contenu1').slideDown();
$('#contenu2').slideUp();
$('#contenu3').slideUp();
});
// la suite ... identique ou presque a titre1!
});
</script>
<div id="titre1>//ton code</div>
<div id="contenu1>//ton code</div>
...
J'ai testé sur une page web vierge, bizarre. ça ne fonctionne pas, ça m'affiche ceci:
///JQUERY //importe jquery...
//ton code
J'ai donc viré du code ces commandes et j'ai retesté et cela ne fonctionne toujours pas, on me mets cette fois-ci "//ton code". Désolé, je suis novice dans ce genre de script.
Est-ce que je dois installer quelque chose en particulier? Ce script doit il être bien dans le body de ma page?
Explique moi en détail s'il te plait car je manque de certaines compétences pour bien faire ce script.
///JQUERY //importe jquery...
//ton code
J'ai donc viré du code ces commandes et j'ai retesté et cela ne fonctionne toujours pas, on me mets cette fois-ci "//ton code". Désolé, je suis novice dans ce genre de script.
Est-ce que je dois installer quelque chose en particulier? Ce script doit il être bien dans le body de ma page?
Explique moi en détail s'il te plait car je manque de certaines compétences pour bien faire ce script.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
lili34500
Messages postés
178
Date d'inscription
lundi 11 février 2008
Statut
Membre
Dernière intervention
17 août 2012
16
3 juin 2012 à 15:22
3 juin 2012 à 15:22
bien voici un petit code maison
<html>
<head>
<title>test</title>
</head>
<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
<script>
$(document).ready(function(){
$('.contenu1').hide();
$('.contenu2').hide();
$('.contenu3').hide();
$('.titre1').click(function(){
$('.contenu1').slideDown();
$('.contenu2').slideUp();
$('.contenu3').slideUp();
});
$('.titre2').click(function(){
$('.contenu1').slideUp();
$('.contenu2').slideDown();
$('.contenu3').slideUp();
});
$('.titre3').click(function(){
$('.contenu1').slideUp();
$('.contenu2').slideUp();
$('.contenu3').slideDown();
});
});
</script>
<body>
<div align="center">
<div class="titre1">TON TITRE 1</div>
<div class="contenu1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
<br><hr>
<div class="titre2">TON TITRE 2</div>
<div class="contenu2">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
<br><hr>
<div class="titre3">TON TITRE 3</div>
<div class="contenu3">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
</div>
</body>
</html>
Merci pour ce scrpt; c'est exactement ce qu'il me fallait, c'est vraiment extra d'avoir des gens qui nous aident comme cela. C'est vraiment aimable de ta part, merci encore! :-)
lili34500
Messages postés
178
Date d'inscription
lundi 11 février 2008
Statut
Membre
Dernière intervention
17 août 2012
16
6 juin 2012 à 08:28
6 juin 2012 à 08:28
n oubli pas de metre le sujet en resolu !
Sinon de rien pour l'aide.
Sinon de rien pour l'aide.
