• Accueil
  • Entreprendre
    • Créer son entreprise
    • Communiquer sur le web
  • Programmation
    • WLangage
    • HTML / CSS
    • PHP / MYSQL
    • Javascript
    • Jquery : enrichissez vos pages webs !
    • Utilisation de CK Editor
  • Votre Ordi
    • Mieux utiliser son PC
  • Systèmes
    • Email
    • Virtualisation
    • Sécurisation de vos systèmes informatiques
    • Optimisation
  • 'Geekeries'
    • Outils de développement
    • On aime
  • C.M.S Nowwweb.com
Accueil > Programmation > Jquery : enrichissez vos pages webs ! > Afficher/ Masquer du contenu html via jQuery
Tags
optimisation   Nowwweb.com   WD   office 2007   CK EDITOR (utilisateurs)   SSL   VMware   IpTables   WD16   CSS   Référencement   recommandé   Compte utilisateur   Vista   Windows7   Alixo   windows   Facebook   linux   word   Créer son entreprise   WinDev   Windows XP   Notepad++   Word 2003   Google   e-mail   Accusé réception   Référencement   Création de site web  

Afficher/ Masquer du contenu html via jQuery

Partager :

Pour se faire, nous allons utiliser les fonctions "show", "hide" et "toggle" de jQuery.

 

Pour tester notre code : copier/coller le dans une de vos page après avoir chargé jQuery (http://tuto.nowwweb.com/sujet-15-charger_jquery_dans_une_page.html)

<p style="display: none" class="a_masquer">Hello</p>
<p  class="a_afficher">Hello</p>
<p class="a_afficher_ou_masquer">Hello</p>

Bouton de test :

<input type="button" value="Masquer" onclick="$('.a_masquer').show('slow');" />

<input type="button" value="Masquer" onclick="$('.a_afficher').show('slow');" />

<input type="button" value="Masquer" onclick="$('.a_afficher_ou_masquer').show('slow');" />


On peut passer un paramètre de vitesse à ces différents fonctions :

  •  un nombre de millisecondes qui determinera le temps d'affichage

  • 'fast' pour 200 and 600 millisecondes,

  • 'slow' pour 600 milliseconds,
Ecrit par Kévin Couvet le 01/09/2011
Dernière modification le 01/09/2011
Categorie : Jquery : enrichissez vos pages webs !
Autres articles sur : HTML , Javascript , Jquery

Commentaires

Mail :     Pseudo :    
Message :
De : skriver:Leta upp denna kod i koclgllen:${BmoaDesdription} och sÃ¥ tar du bort det tvÃ¥ raderna i mitten, sÃ¥ det bara stÃ¥r sÃ¥ här: Och sÃ¥ gör du sÃ¥ i alla olika kodmallar. Hoppas du förstod! le 01/12/2016 à 11h40
skriver:Leta upp denna kod i koclgllen:${BmoaDesdription} och så tar du bort det två raderna i mitten, så det bara står så här: Och så gör du så i alla olika kodmallar. Hoppas du förstod!
De : Blackwolf Impossible de cacher le geaniontsire de lien avec le code fourni. J ai bien modifie9 le fichier functions.php via l e9diteur d apparence. J ai inse le 27/09/2014 à 09h00
Blackwolf Impossible de cacher le geaniontsire de lien avec le code fourni. J ai bien modifie9 le fichier functions.php via l e9diteur d apparence. J ai inse9re9 le code fourni dans une balise de9je0 ouverte et meame en dehors, mais rien n y fait.J utilise actuellement le the8me weaver, est-ce que cela pourrait avoir un impact? A noter que le fichier functions.php modifie9 est celui du the8me weaver.Une ide9e ?

Agence web - Nos auteurs- Tutoriels- Mentions légales