• 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
Compte utilisateur   e-mail   OpenSSL   optimisation   CSS   Javascript   CK EDITOR (utilisateurs)   office 2007   MYSQL   Création de site web   WinDev   Facebook   autoentrepreneur   IpTables   Redimensionnement image   bonnes adresses   Référencement   Créer son entreprise   CMS   Réseau   Alixo   SEO   PHP   disque virtuel   WD   Autorité de certification   mail   Windows XP   HTML   Nowwweb.com  

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