With the class .dialog you can create dialog boxes similar to the popup, the dialog element is formed by a dialog-header, a body and a dialog-dialog-footer, but it is also possible to use it without these elements, the basic dialog box has in the upper left icon to close, but it is also possible to add a button or more for closing the same, adding the item attribute date-dismiss="true", it is also possible to set an effect on the dialog box before the appearance of adding the attribute data-effect="bounce" of the base effect is linear, setting the attribute [data-open-dialog] of an element is passing the id of the dialog box, you can open it directly
Example with action bar
Example of use of the event before-show and after-close
Example of dialog with bounce effectdata-effect="bounceEaseOut"
Example of dialog zoom image
Example of login dialog with dialog grafted clickforgot password
Element dialog you can set the attribute data-duration="200"(ms) to indicate the duration of the animation, also if you want to rumuovere the close button in another simply set always on 'dialog element attributedata-dismiss="false"
Example 200 with the duration and data-dismiss="false"
Example dialog loading
The component with the class .dialog-static has the same characteristics of a component with the class .dialog but it is always visible
With the attributedata-send-url set on an element of the dialog you can send a request ajax post automatically, if the server returns a string that will be applied to the dialog, if the answer is an empty string the page is reloaded
<div class="msg danger"><span class="fa fa-warning"></span> Username or password incorrect!</div>
Dialog show/hide function hideDialog(dialog) showDialog(dialog, duration, timing)
This function hideDialog(dialog) allows you to hide the dialog
This function showDialog(dialog, duration,timing) allows you to show the dialog
dialog a zjs object
duration in milliseconds of the animation
timing effect of the animation