Cils
Les onglets nous permettent de regrouper les informations sur notre site Web par sujet, ce qui permet aux utilisateurs d'obtenir des informations pertinentes rapidement et facilement en sélectionnant simplement l'onglet qu'ils souhaitent.
La méthode tabs()
La méthode onglets(options) déclare qu'un élément du HTML et son contenu doivent être affichés dans des onglets, les paramètres des options sont un objet qui spécifie l'apparence et le comportement des onglets.
La méthode onglets () peut être utilisé de deux manières :
• $ (sélecteur, contexte) .tabs (options)
• $ (sélecteur, contexte) .tabs ("action", paramètres)
Voyons un exemple de sa mise en œuvre :
- Nous incluons les fichiers nécessaires, les bibliothèques de jQuery et les CSS:
- Nous créons notre instance de la méthode onglets () et on l'associe à un sélecteur :
- Enfin dans notre HTML nous créons le contenu qui sera mis en forme dans nos onglets, il est important de mentionner qu'il doit respecter la structure des balisespuis les étiquettes
- et enfin les étiquettespour la méthode d'identification de chaque onglet.
- Nunc tincide
- Douleur profonde
- Lacinie Énée
- Nous incluons les fichiers nécessaires, les bibliothèques de jQuery et les CSS:
- Nous créons notre instance de la méthode accordéon () et on l'associe à un sélecteur :
- Enfin nous créons notre HTML en respectant la structure d'une balisegénéral suivi d'autres balisesqui servira à identifier chaque bloc.
- Créer un compteInscrivez-vous GRATUITEMENT pour avoir votre compte SolveticEnregistrez un compte
- IdentifierAvez-vous déjà un compte? Se connecter iciIdentifiez-moi dans mon compte
- Publié 12 août 2013 00:54
- Visites 3.7K
- NiveauProfessionnel
- Comment mettre à jour NPM avec PowerShell dans Windows 10
- Comment faire glisser et saisir des images avec JQuery UI
- Comment faire un Spinner ou une icône de chargement avec JQuery
- Comment faire traduire un site web en plusieurs langues
Voyons à quoi ressemble cet exemple dans notre navigateur :
Onglets jQuery UI - Fonctionnalité par défaut
Test de tabulation 1.
Morbi tincidunt, dui sit amet facilisis feugiat, je déteste metus gravida avant, ut pharetra massa metus id nunc. Duis scelerisque agace turpis. Soif fringilla, massa eget luctus malesuada, metus eros inconfort lectus, ut tempus eros massa ut douleur. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilité. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Convallis pellentesque. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.
Test de tabulation 3.
Accordéon
Comme les onglets, l'accordéon organise les informations avec la particularité qu'il le fait par blocs dans lesquels seules les informations du bloc qui a été sélectionné seront affichées tandis que les autres restent cachées.
La méthode accordéon ()
La méthode accordéon (options) précise qu'un élément du HTML et son contenu seront gérés comme des menus de type accordéon. Comme la méthode tabs, les options spécifieront son comportement et son apparence.
La méthode accordéon () peut être utilisé de deux manières :
• $ (sélecteur, contexte) .accordion (options)
• $ (sélecteur, contexte) .accordion ("action", paramètres)
Voyons un exemple de sa mise en œuvre :
Notre exemple ressemblera à ceci dans le navigateur :

Ce tutoriel vous a-t-il aidé ?
SinonAIDEZ A AMÉLIORER CE TUTORIEL !
Pensez-vous pouvoir corriger ou améliorer ce tutoriel ? Vous pouvez envoyer votre édition avec les modifications que vous jugez utiles.0 utilisateurs ont modifié ce tutoriel. Editez et devenez un expert reconnu !
Modifier ce tutoriel
TUTORIELS SIMILAIRES
Comment faire glisser et saisir des images avec JQuery UIComment faire un Spinner ou une icône de chargement avec JQueryPlugins et bibliothèques JQuery pour le développement WebGrille dynamique Flexigrid avec JQuery et PHPExpressions régulières avec JqueryGestion des tableaux croisés dynamiques avec le plugin Jquery DatatablesComprendre AJAX avec jQueryFiltres dans les sélecteurs avec Jquery et CSS3 II
Sans commentaires, soyez le premier!
N'attendez plus et entrez dans SolveticLaissez vos commentaires et profitez du compte utilisateur Rejoignez-nous !Information
Derniers tutoriels JavaScript