FBModal jQuery plugin

FBModal is a jQuery plugin that is the first Facebook replica modal dialog.
View it in action, in the video below.

Watch in full screen for best results.
 
Live DemoDownload USAGE FBModal provides a simple ways to invoke a modal dialog. First include the jquery.fbmodel.js file and jquery file and css file. As a chained jQuery function, you can call the fbmodal() function on a jQuery element and a modal dialog will be displayed using the contents of that element. For example: OPTIONS title [Text] Dialog title text cancel [Text] Cancel button text okay [Text] Okay button text okaybutton [Boolean:true] Show the ok button cancelbutton [Boolean:true] Show the cancel button buttons [Boolean:true] Show the buttons opacity [Number] The opacity value for the overlay div, from 0.0 – 100.0 fadeout [Boolean:true] When dialog is closed fade out overlayclose [Boolean:true] Allow click on overlay to close the dialog? modeltop [Number:null] Position from top of page 0% – 100% or 0px – 99999px modelwidth [Number:null] The width for the dialog container CLOSING THE DIALOG Now to close the dialog. Set your element id. Your element id is the id of the content inside of the dialog. Next set the option close to true. How to use in your project. Here is an example of how you can use FBModal in your project. Simply include the latest jQuery library, the plugin file and the css file. Then call the fbmodal() function on a jQuery element and a modal dialog will be displayed using the contents of that element. It’s that simple. BROWSER COMPATIBILITY FBModal has been tested in the following browsers Firefox Version 2-26 Opera Version 9-18 Safari Version 3-7 Chrome Version 1-31

Tagged with:

View all contributions by

Website:

Related Articles

Stay connected with us

Add us on Google+

Follow us on Facebook

Follow us on Twitter

Get updates via RSS

Get email updates

FEEDBACK1

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">