diff options
| author | Jurie-Jan Botha <juriejanbotha@gmail.com> | 2015-02-14 14:54:19 +0300 |
|---|---|---|
| committer | XhmikosR <xhmikosr@gmail.com> | 2015-04-23 13:44:16 +0300 |
| commit | e2cf27cf599f46402d28085fdb8d0bacae76d32b (patch) | |
| tree | b382f5eb886573edc63c14995f7163bf30d572f0 /docs/components.html | |
| parent | d0be556cd857b779aca6394cdc72f357f9aafe0d (diff) | |
Specify modal selector in data attribute with backward compatibility.juriejan-modal-selector-attribute
Diffstat (limited to 'docs/components.html')
| -rw-r--r-- | docs/components.html | 8 |
1 files changed, 5 insertions, 3 deletions
diff --git a/docs/components.html b/docs/components.html index 476ddc1..b8d3edb 100644 --- a/docs/components.html +++ b/docs/components.html @@ -1107,7 +1107,7 @@ document <h3 class="component-title">Modals</h3> <div class="component-example"> - <a href="#myModalexample" class="btn">Open modal</a> + <a href="#" class="btn" data-modal="myModalExample">Open modal</a> <div id="myModalexample" class="modal"> <header class="bar bar-nav"> <a class="icon icon-close pull-right" href="#myModalexample"></a> @@ -1118,8 +1118,10 @@ document </div> </div> + <p class="component-description">Modals are designed to only fire from links. Set the value of the toggle link's data-modal attribute to a selector that will produce the desired modal.</p> + {% highlight html %} -<a href="#myModalexample" class="btn">Open modal</a> +<a href="#" class="btn" data-modal="#myModalExample">Open modal</a> <div id="myModalexample" class="modal"> <header class="bar bar-nav"> <a class="icon icon-close pull-right" href="#myModalexample"></a> @@ -1132,7 +1134,7 @@ document </div> {% endhighlight %} - <p class="component-description">Modals are designed to only fire from links. Set the value of the toggle links href to the id of a modal.</p> + <p class="component-description">DEPRECATED: Alternatively you can specify the selector of the desired modal in the href attribute of the link. This will fail without a warning if a modal is not found.</p> </article> |