Comment éliminer le bouton de fermeture dans une boîte de dialogue jQuery UI à l'aide de CSS ?

Afficher les données dans un ordre trié dans des pages Web HTML est une tâche fastidieuse. Les boîtes de dialogue sont utilisées pour afficher des informations sous une forme présentable dans une page Web. Une boîte de dialogue est une fenêtre flottante contenant un titre et un contenu. jQuery UI permet aux développeurs de créer des boîtes de dialogue simples et conviviales pour les sites Web. Dans cet article, nous verrons comment créer des boîtes de dialogue jQuery UI et comment éliminer le bouton de fermeture dans ces boîtes.

Tout d’abord, comprenons la boîte de dialogue jQuery UI.

Boîte de dialogue de l'interface utilisateur jQuery

jQuery Dialog() permet aux développeurs de créer une simple fenêtre de dialogue dans la fenêtre qui n'est pas affectée par le contenu de la page. dialog() method est utilisée pour indiquer au navigateur que n'importe quel élément HTML peut être affiché sous la forme d'une boîte de dialogue. Il se compose d'une barre de titre et d'un espace de contenu. Par défaut, il peut être déplacé, redimensionné et supprimé via le bouton de fermeture (x).

Grammaire

$(selector, context).dialog (options);

Paramètres

• Titre− Il permet aux développeurs de décider du titre affiché dans la boîte de dialogue.

• Largeur- Il permet aux développeurs de décider de la largeur de la boîte de dialogue.

• Position- Il permet aux développeurs de décider de la position initiale de la boîte de dialogue.

• Hauteur- Il permet aux développeurs de décider de la hauteur de la boîte de dialogue.

• Button - Utilisé pour ajouter des boutons aux boîtes de dialogue.

• Max-height - Détermine la hauteur maximale de la boîte de dialogue

• Max-width - Détermine la largeur maximale de la boîte de dialogue

• Min-height - Détermine la hauteur minimale de la boîte de dialogue

• Min-width - Détermine la largeur minimale de la boîte de dialogue

• Appendto - Lorsque cette option est définie sur false, elle nous permet d'empêcher l'ajout de la classe UIdraggable à la liste des éléments HTML DOM.

• Ouvrir automatiquement - Lorsque cette option est laissée vraie, la boîte de dialogue s'ouvrira dès sa création. Si faux, une boîte de dialogue s'ouvrira lors de l'appel.

Étapes à suivre

Voici les étapes à suivre pour créer une boîte de dialogue JQuery.

Étape 1 - Ajoutez jQuery et jQuery UI CDN au code à l'intérieur de la balise