0
How to create
a jQuery Modal Window using
Likno Web Modal Windows Builder
www.likno.comLikno Web Modal Windows Builder
Likno Web Modal Windows Builder is a powerful
application for creating jQuery Modal Windows.
You can create any modal wind...
First, open Likno Web Modal Windows Builder.
The application starts with an empty default modal window project.
www.likno....
You can start creating by the default project or browse through the Examples
and then create a “New from Example”.
www.lik...
Save your project, select the folder where you want to save it and give it a name.
www.likno.comLikno Web Modal Windows Bu...
In Project Items tab, in Modal Windows in Project section, you can
Add/Delete/Edit your modal windows.
Note that you can h...
Then, you can select if you want to show the modal window content as
specified inside the project or if you want to make c...
Then, you can define the content of your modal window.
You have many options for the source of your modal window content.
...
In Opens When section you can see how you can call your modal window and
also set some properties like:
- Automatically op...
In Style Editor tab in Open/Close section you can define the open/close effects.
www.likno.comLikno Web Modal Windows Buil...
In Style Editor tab in General you can set the Styling properties for your modal window.
You can also set the Header and F...
In Style Editor tab in Navigation Bar you can select the Navigation Bar for your modal
window and edit its styling propert...
In Style Editor tab in Multi-Sheet you can define some settings in case you have
a multi-sheet modal window, like the tran...
In Preview tab you can see your modal window in action.
www.likno.comLikno Web Modal Windows Builder
When you have finished with your modal window, it’s time to compile it.
Click on Compile and set your Site Root Folder, th...
Then, you need to link the modal window project to your page.
Select the page or pages you want to link it to and move the...
The final step is to trigger the modal window on your page.
You can see the Opens When for the ways you can trigger your m...
Visit www.likno.com for more information
Upcoming SlideShare
Loading in...5
×

How to create a jQuery Modal Window

194

Published on

In this presentation it is described how to create a jQuery Modal Window using Likno Web Modal Windows Builder.

Likno Web Modal Windows Builder is a powerful application for creating any type of jQuery Modal Windows (popup boxes, dialog boxes, etc.).

Likno Web Modal Windows Builder info: http://www.likno.com/jquery-modal-windows/index.php
Examples: http://www.likno.com/jquery-builders/examples.php?p=lwmw&e=n
Download: http://www.likno.com/jquery-modal-windows/download.php

Published in: Software, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
194
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "How to create a jQuery Modal Window"

  1. 1. How to create a jQuery Modal Window using Likno Web Modal Windows Builder www.likno.comLikno Web Modal Windows Builder
  2. 2. Likno Web Modal Windows Builder is a powerful application for creating jQuery Modal Windows. You can create any modal window through its WYSIWYG interface without writing any code. There are a lot of ways to define the content of your modal window and many ways to render it on your page. www.likno.comLikno Web Modal Windows Builder
  3. 3. First, open Likno Web Modal Windows Builder. The application starts with an empty default modal window project. www.likno.comLikno Web Modal Windows Builder
  4. 4. You can start creating by the default project or browse through the Examples and then create a “New from Example”. www.likno.comLikno Web Modal Windows Builder
  5. 5. Save your project, select the folder where you want to save it and give it a name. www.likno.comLikno Web Modal Windows Builder
  6. 6. In Project Items tab, in Modal Windows in Project section, you can Add/Delete/Edit your modal windows. Note that you can have many modal windows in a modal window project. www.likno.comLikno Web Modal Windows Builder
  7. 7. Then, you can select if you want to show the modal window content as specified inside the project or if you want to make certain links/forms in your page to open in that modal window. www.likno.comLikno Web Modal Windows Builder
  8. 8. Then, you can define the content of your modal window. You have many options for the source of your modal window content. It can be an embedded content, a page element, an image, Ajax content or an external page that could be an HTML page, a PDF document etc www.likno.comLikno Web Modal Windows Builder
  9. 9. In Opens When section you can see how you can call your modal window and also set some properties like: - Automatically open on page load - Automatically open on mouse out of the page - Do not re-open for the same user www.likno.comLikno Web Modal Windows Builder
  10. 10. In Style Editor tab in Open/Close section you can define the open/close effects. www.likno.comLikno Web Modal Windows Builder
  11. 11. In Style Editor tab in General you can set the Styling properties for your modal window. You can also set the Header and Footer Content. www.likno.comLikno Web Modal Windows Builder
  12. 12. In Style Editor tab in Navigation Bar you can select the Navigation Bar for your modal window and edit its styling properties, as long as you have a multi-sheet modal window. www.likno.comLikno Web Modal Windows Builder
  13. 13. In Style Editor tab in Multi-Sheet you can define some settings in case you have a multi-sheet modal window, like the transition effect, the floating arrows, the direction and more. www.likno.comLikno Web Modal Windows Builder
  14. 14. In Preview tab you can see your modal window in action. www.likno.comLikno Web Modal Windows Builder
  15. 15. When you have finished with your modal window, it’s time to compile it. Click on Compile and set your Site Root Folder, the Compiled JavaScript file name and the domain for which you want the modal window to work. www.likno.comLikno Web Modal Windows Builder
  16. 16. Then, you need to link the modal window project to your page. Select the page or pages you want to link it to and move them to the right side. When you have selected all the pages click on the “Link” button. www.likno.comLikno Web Modal Windows Builder
  17. 17. The final step is to trigger the modal window on your page. You can see the Opens When for the ways you can trigger your modal window. www.likno.comLikno Web Modal Windows Builder
  18. 18. Visit www.likno.com for more information
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×