• 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
Accusé réception   VMware   MYSQL   office 2007   mail   linux   Windows XP   Facebook   Virtualisation   optimisation   Nowwweb.com   SSL   Référencement   Jquery   bonnes adresses   autoentrepreneur   recommandé   OpenSSL   IpTables   Redimensionnement image   Windows7   Notepad++   WinDev   e-mail   CSS   Création de site web   CMS   Autorité de certification   Google   word  

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