L'éditeur JavaScript
Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?
Rechercher :
Page d'accueil
     Home Page

JavaScript
     Tous les scripts
     Proposer un script
     Recherche de script
     AJAX
     Cours de JavaScript
     Liste de discussion
     Forums

Services :
     CountUs
     myCircle
     ClickInText
     XooIt

Trucs et astuces :
     HTML / CSS
     PHP / MySQL
     Réferencement
     Graph / Présentation
     Toutes les astuces
     Ajouter un article

MailingList :
122566 abonnés

Annuaire webmaster :      Hebergement web
     Referencement
     Sites webmasters
     XHTML - CSS2
     PHP
     Affiliation - Pub
     FAI

     Annuaire webmaster

Ressources pour webmasters :
     Kit graphique
     Foire aux questions
     Les membres
     Devenir annonceur
     Faire un lien
     Contact

Partenaire :
     Compteur live
     Créer un forum
     Le PHP facile
     Comscripts
     Liens sponsorisés
     Blog
     Page Rank
     Gifs animés, f...
     Poésie et cita...
     Azote.org - no...
     Easy-script.com
     Web creation ...
     Je crée mon site
     Outils de créa...
     Electroniq...
     K i s s design
     Créer son site...
     Les autres
     Votre site ici ?


Plus d'infos

Script posté par :

Dempsey Chesley
Vous aussi, postez vos scripts en cliquant ici.


Description

Appuyez sur du texte ou une image pour faire apparaître une section de votre site caché et recliquez sur le lien et la partie cachée disparaît.


Compatibilité :

 FireFox : Toutes versions
 Mozilla : 1 et +
 Netscape Navigator : 6 et +
 Internet Explorer : 5 et +
Ce script utilise le DHTML


Chiffres :

Date de création : 5/10/2005
Dernière modif : 15/11/2005
Visites de la page : 28794
Envois par mail : 334


Dernière modification du script :

Le 15/11/2005 : Petit bug sous IE corrigé.
>> Voir toutes les modifications effectuées sur ce script.


Exemple :

Vous aimeriez en savoir plus ? [+]


Le code :

Entre <HEAD> et </HEAD> :


Entre <BODY> et </BODY> :


Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript


Les annotations des visiteurs :

De dgse - le 09-10-2005
bonjour

Une petite erreur dans le script il suffit de remplacer

table = document.getElementById
('table');

par exemple par:

t = document.getElementById('table');

pour que celui ci fonctionne correctement.

@+ Dgse
De Dempsey Chesley - le 14-11-2005
Il se peut que j'aie fait une erreur. Juste la modifier à la main. Pour l'instant, je vais contacter l'admin pour qu'il le change.
De the new Faith - le 07-03-2006
on ne peut pas en mettre 2 ou plus de ce code sur une même page????
De azaret - le 28-06-2006
Si vous voulez en mettre plus de 2 sur la même page, voici le code quelque peu modifier pour qu'il fonctionne :

dans
onClick="show('Nom du span','Nom du lien')

"Nom du span" correspond à l'Id du texte qui s'affiche et "Nom du lien" correspond à l'Id du lien "+".

Bien sur dans une même page donner des noms différents pour chaque texte et lien

Entre <HEAD> et </HEAD> :
<SCRIPT LANGUAGE="Javascript">
var textspan = '';
var texthelp = '';
function show(span,help) {
var textspan = span;
var texthelp = help;
if(document.getElementById){
tabler = document.getElementById("" + span + "");
if(tabler.style.display=="none"){
document.getElementById("" + help +"").innerHTML = '-';
tabler.style.display="";}else{document.getElementById("" + help +"").innerHTML = '+';
tabler.style.display="none";
}
}
}
</script>


Entre <BODY> et </BODY>
<span style="font-weight:bold;">Vous aimeriez en savoir plus ?</span>
[<a href="#" onClick="show('Nom du span','Nom du lien');return(false)" id="Nom du lien">?</a>]

<span id="Nom du span" style="display:none">
<br />Vous en savez désormais en peu plus ! :)<br />
Appuyer sur le lien [-] pour faire disparaître le texte ou :<br />
<a href="#" onClick="show('Nom du span','Nom du lien');return(false)">Cacher ce texte</a>
</span>
De Evilmax - le 23-12-2006
J'ai un petit probléme :

A la place de mettre un "+" ou un "-", je veux mettre un mot.
Ca je sais faire mais je veux metre plusieurs fois le code avec un mot different a chaque fois.
Dans votre code c'est toujours le même lien : "+" et "-", est-t-il possible de le changer pour chaque codes?

Merci a ceux qui pourront m'aider.
De loraspirit - le 12-03-2007
Bonjour.

J'aurai voulu savoir si ce code peut s'appliquer si j'utilise du php.
je m'explique :
je veux créer une liste de lien en dynamique (appel à la base et utilisation d'un while).
j'aimerai que quand je click sur un des liens, un bloc de texte apparaisse juste en dessous du lien cliqué, sachant que ce block de texte est également dynamique en fonction du lien.

merci par avance
De yesuah - le 25-02-2008
pour répondre à ta question, pour mettre un mot à la place du - ou du +, dans la balise head, il suffit de changer quelque truc. Comme indiquer !
<script language="Javascript">
var textspan = '';
var texthelp = '';
function show(span,help) {
var textspan = span;
var texthelp = help;
if(document.getElementById){
tabler = document.getElementById("" + span + "");
if(tabler.style.display=="none"){
document.getElementById("" + help +"").innerHTML = '-';
tabler.style.display="";}else{document.getElementById("" + help +"").innerHTML = '+';
tabler.style.display="none";
}
}
}
</script>

cette ligne là change là,
document.getElementById("" + help +"").innerHTML = '-';

tu met à la place du '-', le mot que tu désire, et pour le + pareil
comme ceci
{document.getElementById("" + help +"").innerHTML = '+';

et à la place du + tu mets le mot que tu désires

Je répète c'est dans la balise <head></head> que tu le fais

Courage !
De dgse - le 26-02-2008
Bonjour

Plus simple et qui fonctionne aussi,on peut remplacer les liens par des icones. ;o)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<script type="text/javascript" language="Javascript">
function show(nom_champ)
{
if(document.getElementById)
{
tabler = document.getElementById(nom_champ);
if(tabler.style.display=="none")
{
tabler.style.display="";
}
else
{
tabler.style.display="none";
}
}
}
</script>
</head>
<body>
<!-- Exemple 1-->
<a href="#" onClick="show('i1');return(false)" id="plus">+ d'info</a>
<div id="i1" style="display:none">Info 1 <br>
<a href="#" onClick="show('i1');return(false)" id="plus">Fermer</a>
</div>
<br><br><br>
<!-- Exemple 2-->
<a href="#" onClick="show('i2');return(false)" id="plus">+ d'info</a>
<div id="i2" style="display:none">Info 2 <br>
<a href="#" onClick="show('i2');return(false)" id="plus">Fermer</a>
</div>
</body>
</html>


@+ Dgse
De melodid - le 12-05-2010
Ok super ce code !!! mais comment on fait dans le cadre d'un tableau dont les éléments sont générés par du html ??

En faite j'ai un tableau qui donne sa :
LIB----------MADATE--------------CODE-
connect----------26/01/10----------1-
connect----------26/01/10----------1-
connect----------30/04/10----------2-
connect----------30/04/10----------2-

j'aimerais garder une seule date correspondant à une seule connexion d'un code d'utilisateur et mettre à coté un petit + pour que l'on puisse voire toutes les connexions de cet utilisateur. En gros je voudrais un tableau qui donne ça :

LIB----------MADATE--------------CODE-
connect----------26/01/10---------1-(+)
connect----------30/04/10---------2-(+)

Mais comment je fais pour que mon code le fasse pour chaque ligne qui contient le même CODE et la même DATE??!


>> Poster une annotation sur ce script






compteur gratuit
actuellement en ligne

    PUBLICITE



     ANNUAIRE WEBMAST.
InkClub.com
Votre premiere cartouche d'encre gratuite, les autres a des prix tres interessants !
http://www.inkclub.fr
Cat : Hardware
Voir l'annuaire webmaster


     LES SCRIPTS :
78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

     LES MEMBRES :
65967 membres
4649 comptes CountUs
1842 comptes myCircle

     LES FORUMS :
14 forums
40359 topics
191688 messages
>> Les forums

    SONDAGE

Vous avez un blog ou site classique ?
Un blog
Un site classique
Les deux !
La mini-astuce "Referencement" du jour par krucial
Pour savoir combien de pages de votre site sont indexées dans Google, il vous suffit de taper, dans la boite de recherche du moteur : "site:http://www.votresite.com";.
Proposer votre mini-astuce | Archives des mini-astuces
© 1999-2012 EJS - Tous droits réservés | CNIL N° 844440 | 12/02/2012 09:24:48 | Design by | Gen. en 0.494 sec.