How to create Popup box with facebox and jquery

Now in web 2.0 the UI is very important part of web development.So Java script and CSS is playing very important role in web development.Here i am discussing how to create popup box with help of facebox and jquery.Its very simple and easy.You can download facebox from here.

Checkout other Popup tutorial,

Simple Facebox Example With jQuery

Step 1: First we will include js file and jquery file of facebox.
[code type=”html”]

Step 2: Now create link in html to display popup.
[code type=”html”]

Step 3: create popbox and include all the the content which is want to display in html file.

[code type=”html”]

Note: popup box id is same as href of step 2.

Step 4: Now include js code to display facebox popup.

[code type=”html”]

You can see resulted screen shot below:


This is a simple tutorial of facebox examples using jquery.The facebox is to use and integrate with your application without any coding knowledge.

You can download source code and Live Demo from below link.