begin process at 2012 02 14 12:43:27
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Effets

 > AFFICHER OU CACHER UN COMPOSANT AVEC JAVASCRIPT V1.0

AFFICHER OU CACHER UN COMPOSANT AVEC JAVASCRIPT V1.0


 Information sur la source

Note :
1 / 10 - par 1 personne
1,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Effets Classé sous :afficher, cacher, javascript, visible, invisible Niveau :Débutant Date de création :06/03/2010 Date de mise à jour :08/03/2010 12:01:37 Vu :3 124

Auteur : xloadx

Ecrire un message privé
Site perso
Commentaire sur cette source (18)
Ajouter un commentaire et/ou une note

 Description

CODE EN DOUBLON qui ne sert à rien selon la communauté, je garderai dorénavant mes scripts...trop écoeuré de la mentalité sur ce site....je n'avais pas demandé de passer devant un jury, ce script devait juste servir aux newbies....

Source

  • ------------------- SUPPRIMÉ --------------
  • POUR INFO, j'utilise JQuery et Prototype...donc pas besoin de me faire un cours dont je connais déjà le contenu
------------------- SUPPRIMÉ -------------- 

POUR INFO, j'utilise JQuery et Prototype...donc pas besoin de me faire un cours dont je connais déjà le contenu

 Conclusion



Ramener sa science auprès des autres n'a jamais rien amené de bon...


 Historique

06 mars 2010 00:33:28 :
Modif description
06 mars 2010 00:36:33 :
Modif code
06 mars 2010 17:13:48 :
Mise à jour explication d'intégration
08 mars 2010 12:01:40 :
C'est la vie, on fait comme on a envie, bah là j'ai envie et je le fais, donc pas besoin de m'envoyer des textos, des mails, des injures, des critiques, fini pour moi le post de scripts. Je pensais que la mentalité s'était améliorée sur ce site....mais il n'en est rien !

 Sources du même auteur

FONCTION BLINK ( TESTÉE SOUS FF ) PORTABILITÉ IE OP ET GC EN...
AJOUT NOEUDS + OBJETS + LIENS (AJOUTUBE V1.1)
Source avec Zip Source avec une capture FOND D'ÉCRAN DÉFILANT AVEC FONCTION MARCHE/ARRÊT ( AJOUT JQU...
Source avec Zip Source avec une capture INFO BULLE MULTI -TEXTE OU FAUSSE FENÊTRE POPUP (SIMPLE ET P...
Source avec Zip Source avec une capture TEXTE DÉFILANT ( BOUTONS : ARRÊT - PAUSE - AVANT - ARRIÈRE E...

 Sources de la même categorie

Source avec Zip Source avec une capture SHOWMAPAREA par phidelum
DHTML IE FILTRE DÉGRADÉ (OUTIL HTML POUR DÉVELOPPEUR) par internetdev
Source avec Zip ANIMATION DU TEXTE par brennal
Source avec Zip Source avec une capture EFFET RAYONS DU SOLEIL par tefa24600
TAILLE DE TEXTE EN FONCTION DE LA RÉSOLUTION par tefa24600

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture SUBDIVISER LE RÉSULTAT D'UNE RECHERCHE EN PAGES par kimmp
Source avec Zip Source avec une capture CALCULATRICE HEURE par m22001111
Source avec Zip Source avec une capture COPIER DU TEXTE par m22001111
AFFICHER CACHER PLUSIEURS OBJETS D'UN SEUL CLICK par PetoleTeam
Source avec Zip CURSEUR INVISIBLE par abdelaziz_info

Commentaires et avis

Commentaire de Kimjoa le 06/03/2010 09:30:06

c'est plus un snippet.

Comme tu le dit display n'a pas nécessairement comme valeur block;
De plus, si le style de ton élément est dans une css, pour récupérer le display , il faut passé par une méthode spéciale et non via la propriété style.

Donc il te faut une méthode cross-browser pour récupérer le style, plus ajouter un argument à ta fonction pour spécifier le display ou sauvegarder l'état initiale du display sauf si sa valeur est à none;

concernant le style en volà une toute prête.

var getStyle = function(/*DOMObject*/element, /*string*/rule){//peux etre definit en globale car très utilise, aucune dépendance...
    var camelRule=rule.replace(/\-(\w)/g, function (strMatch, p1){return p1.toUpperCase();}),//supprime les tiré et met en majuscule la lettre suivante
        value = element.style[camelRule];
    if (!value){
        if(document.defaultView && document.defaultView.getComputedStyle){
            value = document.defaultView.getComputedStyle(element, "").getPropertyValue(/*fait l inverse de camelRule*/rule.replace(/[A-Z]/g, function(match){return '-'+match.charAt(0).toLowerCase();}));
        }else{//specifique ie
            value = element.currentStyle[camelRule] ;
        }
    }
    return value == 'auto' ? undefined : value;
};

pour ta fonction voir ca pourrait donner ca :

var toogleDisplay = function(id, display){
   var el = document.getElementById(id),
   currentDisplay = getStyle(el, 'display');
  
   if(currentStyle == 'none'){
       el.style = display || el.style.__originalDisplay ||  'block';
   }else{
       el.style.__originalDisplay = currentStyle;
       el.style = 'none';
   }
  
}

brute de fonderie à tester. Mais comme quoi c'est pas si simple !

a++

Commentaire de Kimjoa le 06/03/2010 09:33:12

bon je viens d eme reveiller :)

var toogleDisplay = function(id, display){
   var el = document.getElementById(id),
   currentDisplay = getStyle(el, 'display');
  
   if(currentDisplay == 'none'){
       el.style.display = display || el.style.__originalDisplay ||  'block';
   }else{
       el.style.__originalDisplay = currentStyle;
       el.style.display = 'none';
   }
  
}

toujours pas tester, mais ca devrait le faire !

Commentaire de kazma le 06/03/2010 14:14:55 administrateur CS

autre remarque si le style de l'element au chargement est definit par une feuille de style cela ne fonctionnera pas car style ne pointera pas sur le css mais sur le style de la balise il faut imperativement utiliser getComputedStyle et currentStyle

et comme l'a dit Kimjoa c'est une snippet

Commentaire de xloadx le 06/03/2010 17:04:49

Mdrrr c bien se que je disais, des solutions à 170 lignes mini...bon alors je précise en passant que le CSS doit être inclus dans l'argument de l'objet :

<div style="display:none;" id="objetDIV">Qu'est ce que j'avais dit ?</div>

en mettant juste cela le script fonctionne très bien !!!!!


ET JE LE REDIS, UNE VERSION SIMPLE ACCESSIBLE MEME AUX NOVICES.

Commentaire de xloadx le 06/03/2010 17:10:58

Et pour info c quoi l'intérêt de rajouter autant de variables pour arriver au même résultat que moi ?

Ah oui ça fait super joli et ramène science...mais bon passer 10 lignes pour faire la même chose que 3...vraiment je ne pige pas !!! J'ai peut-être raté un passage ?

Testé sous IE / FF / Safari / Opera / G-Chrome

Commentaire de jdmcreator le 06/03/2010 19:59:38

C'est que dans ton script, si tu caches une balise <SPAN> puis que tu la réouvres, il y aura un saut de ligne après.

Ce bug est réglé beaucoup plus facilement avec leur code ;)

Commentaire de kazma le 06/03/2010 21:00:53 administrateur CS



je sais par pouquoi tu t'emporte c'est sur sa marche bien mais par rapport a ce que je disait ca impose des contraintes et je le repete c'est plus une snipet qu'autre chose?

ce script c'est du banal de chez banal, du vue et revue.

Commentaire de crazygogo le 07/03/2010 10:21:22

Jquery pawa !

Commentaire de crazygogo le 07/03/2010 10:39:26

http://docs.jquery.com/Tutorials:Basic_Show_and_Hide

Commentaire de Kimjoa le 07/03/2010 13:44:23 1/10

daccord avec kazma, c'est vue et revue. Moi j'aurais dit Mootools pawa :).

Sinon quand on programme en js et html , on essaye de le faire bien.
On évite d'écrire le css dans une balise. Si un débutant essaye ton script , et si lui à respecter cette règle il fait quoi? Il s'énerve devant son pc , comme toi tu viens de le faire.

De plus, si ce même débutant utilise un display 'inline' pour un span , ou 'inline-block', il fait quoi?

Bref on a bien compris que tu cherchais a faire simple, mais faut aussi chercher a faire fonctionnel non?

Commentaire de djamel28dz le 08/03/2010 10:35:19

Merci

Commentaire de PetoleTeam le 19/03/2010 09:51:27

Bonjour,

Tu as une notion de communauté qui me laisse un peu rêveur, en effet 3 intervenants, si l'on excepte les inutiles requérant plus de 100ko pour afficher Hello world, sur un potentiel de plusieurs milliers alors...

Concernant ta remarque <! je pensais que la la mentalité s'était améliorée sur ce site !> je te renvoi à ce que je viens d'écrire ci dessus.

Les commentaires restent néanmoins judicieux et pointent sur la difficulté de mettre un script satisfaisant le plus grand nombre.

Il n'empêche aussi que certains scripts sont portables et d'autres résolvent des problèmes ponctuel comme le tien, et les deux cohabitent sur ce site.

Il ne faut pas être pour l'un ou pour l'autre de façon hautaine quoiqu'il arrive les deux sont nécessaires.

Je pense que c'est ta façon d'aborder la chose qui t'as valu le ton de certaines remarques.

Enfin il reste dommageable que tu la supprimes, il y a d'ailleurs un commentaire laconique mais encourageant de la part de djamel28dz qui montre sont utilité.

Maintenant tu es libre, bien évidement, de faire ce que tu souhaites...
...quoiqu'il arrives bonne continuation.

M'enfin qui suis je pour juger ?
;O)

Commentaire de crazygogo le 19/03/2010 10:22:05

$('#hideh1').click(function(){
     $('div.showhide,h1').hide();
});
$('#showh1').click(function(){
     $('div.showhide,h1').show();
});
$('#toggleh1').click(function(){
     $('div.showhide,h1').toggle();
});

pourquoi se casser la tête à ré-inventer la roue ????

Commentaire de jdmcreator le 19/03/2010 13:41:02

Là, c'est du JQuery ;) Ça ne fonctionnera jamais si l'on a pas JQuery (25KO)

Commentaire de crazygogo le 19/03/2010 14:18:43

je sais bien, c'est la suite de mon message juste au dessus !

qu'est-ce que 25Ko de nos jours ? pour assurer la compatibilité tous navigateurs + la légèreté de tous le code qui sera développé  sans avoir à ré-écrire des fonctions qui existent déjà + garder le développeur de bonne humeur car le développement javascript devient facile ?

LOL :)

Commentaire de Kimjoa le 19/03/2010 16:48:41

"CODE EN DOUBLON qui ne sert à rien selon la communauté"

+1 !

"je garderai dorénavant mes scripts...trop écoeuré de la mentalité sur ce site"

Non mais lol, tu tend le bâton pour te faire battre et viens te plaindre ensuite !!

"je n'avais pas demandé de passer devant un jury, ce script devait juste servir aux newbies"

Je répète ce que j'ai dit, le newbie à besoin de base solid si ils veulent évoluer dans le language, si tu respectes pas la mise en forme avec les css, et leur fournit une fonction seulement pour des div, tu leurs rends pas service.

"POUR INFO, j'utilise JQuery et Prototype...donc pas besoin de me faire un cours dont je connais déjà le contenu"

Lol ba regarde les fonctions du même type dans prototype et jquery, ont en reparlera après !

"Ramener sa science auprès des autres n'a jamais rien amené de bon.."

Voilà ce que ca donne quand on est tros fière pour accepter la critique. On s'en prend aux autres, alors que ceux-ci veulent seulement t'aider.

Commentaire de jdmcreator le 20/03/2010 15:08:29

Oups... désolé... je n'avais pas vu ton message en haut ;)

Commentaire de jdmcreator le 20/03/2010 15:10:43

"garder le développeur de bonne humeur car le développement javascript devient facile"

Ça déepnd de chaque développeur. Je n'ai jamais été capable d'utiliser un framework genre JQuery, Prototype.JS car je n'ai pas l'impression d'avoir le contrôle ^^ Je préfère écrire mes scripts moi-même

Le seul framework que j'ai déjà utiliser est SoundManager2 ---> Script exceptionnel

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Fonction javascript afficher/cacher [ par worstangel ] Comment Cacher/afficher du texte Onclik ? [ par Danimoth ] Bonjour, J'aimerais cacher un bloc de html et l'afficher quand l'utilisateur clique sur un (+). blabla (+) On peut jouer &#224; la guerre, mais la gu Afficher Cacher une calque [ par moha007 ] Bonjour les amisj'ai besoin de votre aide s'il vous plaît:dans mon site, j'ai mis une Barre de navigation qui contient:des menus et des sous menus:Men Afficher/Cacher dans une arborescence [ par julex ] Bonjour, voila mon probleme : Sur mon site, j'ai mis un service qui permet d'explorer un ftp. Une page en php s'en occupe, et renvoi les résultats dan afficher un menu ou une image sur passage de la souris [ par Prototype51 ] Bonjour à tous, Je suis en train de créer mon premier site, conçu principalement en PHP. Jusqu'à présent j'ai réussi à tout faire grâce à PHP, je n'ai Détecter est afficher les coordonées de la page du navigateur ??? [ par supergrey ] Bon, déjà je précise qu'en javascript je suis un newbie. Je voudrais afficher dans la barre de titre du navigateur , la position de la fenetre du navi Afficher / cacher Objet [ par mecsensible ] BonsoirJ'aimerai réaliser le même effet  de + ET - (image)et cacher toute la cellule du tableau  comme sur le site www.codes-sources.com/<img src="htt Recherche javascript cacher menus navigateur [ par skym00n ] Bonjour,Je souhaite ouvrir des fenêtres htm à la taille voulue pour y insérer des lecteurs de musique. Ainsi la page doit faire juste la taille du lec Comment afficher une page HTML via javascript [ par sloyvy ] Prolème Masquage/Affichage [ par daan53 ] Bonjour, Je débutte en JavaScript, et j'ai fait un script long et répétitif qui ne sert que à afficher et cacher. Le but est de cacher/afficher des é


Nos sponsors


Sondage...

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,778 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales