iOS Like Toast Notification & Modal Dialog Plugin - jQuery lDialog

iOS Like Toast Notification & Modal Dialog Plugin - jQuery lDialog

lDialog is a lightweight, multi-purpose jQuery popup box plugin that lets you create iOS inspired toast notifications, loading indicators, and alert/confirm modal windows on the web app.

Built-in themes:

  • Default
  • Primary
  • Link
  • Success
  • Info
  • Warning
  • Danger

How to use it:

1. To get started put the following JavaScript and CSS files in your document.

<link rel="stylesheet" href="./dist/css/lDialog.css">
<script src="" 
<script src="./dist/js/lDialog.js"></script>

2. Create a toast notification which auto dismisses after 2 seconds in this example:

  // toast content
  content:'This is a toast',
  // auto dimisses after 2 seconds
  duration: 2000,
  // theme name

3. Create a toast notification with an icon.

  // toast title
  title: 'This is a toast',
  // or 'error'
  icon: 'success',
  // theme name
  // auto dimisses after 2 seconds
  duration: 2000

4. Create a loading indicator with custom loading text.

  // loading text
  title: 'Loading...',
  // theme name
// close the loading indicator manually

4. Create a modal-style alert dialog.

  // modal title
  // modal content
  content:'Alert Content',
  // button text

6. Create a modal-style confirmation dialog with a calbback function which will be fired when you click the 'confirm' button.

  // confirm title
  title:'Dialog Title',
  // confirm content
  content:'Dialog Body'

This awesome jQuery plugin is developed by evinLiang. For more Advanced Usages, please check the demo page or visit the official website.

  • Publication date: 17.07.2018
  • Source