mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-11 18:02:28 +03:00
Use a streamlined way to trigger component dismiss (#34170)
* use a streamlined way to trigger component dismiss * add documentation Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
@@ -840,17 +840,8 @@ Activate a modal without writing JavaScript. Set `data-bs-toggle="modal"` on a c
|
||||
```
|
||||
#### Dismiss
|
||||
|
||||
Dismissal can be achieved with `data` attributes on a button **within the modal** as demonstrated below:
|
||||
{{% js-dismiss "modal" %}}
|
||||
|
||||
```html
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
```
|
||||
|
||||
or on a button **outside the modal** using the `data-bs-target` as demonstrated below:
|
||||
|
||||
```html
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" data-bs-target="#my-modal" aria-label="Close"></button>
|
||||
```
|
||||
{{< callout warning >}}
|
||||
While both ways to dismiss a modal are supported, keep in mind that dismissing from outside a modal does not match [the WAI-ARIA modal dialog design pattern](https://www.w3.org/TR/wai-aria-practices-1.1/#dialog_modal). Do this at your own risk.
|
||||
{{< /callout >}}
|
||||
|
||||
Reference in New Issue
Block a user