This notice will self-destruct in 3 seconds.
Notifications are the natural extension of the notice
classes. They should be used to inform the user of a changed state
or new information. They can be shown by default, appear after a specified period of time, disappear
after a given time, be persistent, or be closed manually.
Note Be careful not to overuse notifications. They can be extremely aggrevating to users if they are used too frequently.
Notifications have two options that control when the notification appears and disappears. All options
are passed in as an HTML5 data-
attribute and none of them are required.
Data Attribute | Description |
---|---|
data-closeTime |
The number of milliseconds before the notification is closed automatically. |
data-openTime |
The number of milliseconds before the notification is opened
automatically. The notification should be given the hidden class to hide
it initially. |
Notifications can be closed manually by adding the following code to the notice:
<a href="#" class="close">x</a>
If you want the notification to persist, simply omit the close link.
For the example above that appears after 3 seconds and then disappears 3 seconds later, use the following code:
<div class="warningNotice hidden" data-openTime="3000" data-closeTime="6000"> <a href="#" class="close">x</a> <p>This notice will have appeared after 3 seconds. It will disappear 3 seconds later.</p> </div>
VM UI Framework is created, owned, maintained by Virtuosi Media, Inc. © 2012-2013.