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.
1 2 3 4 |
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/ 1.7.1/jquery.min.js"></script> <script type="text/javascript" src="jquery.fbmodel.js"></script> <link rel="stylesheet" type="text/css" href="fbmodal.css" /> |
1 |
$("#your-element-id").fbmodal(); |
1 2 3 4 5 6 7 8 9 10 11 12 13 |
$("#your-element-id").fbmodal({ title: "FaceBook Modal Demo", cancel: "Cancel", okay: "Okay", okaybutton: true, cancelbutton: true, buttons: true, opacity: 0.0, fadeout: true, overlayclose: true, modaltop: "30%", modalwidth: "400" }); |
1 |
$("#your-element-id").fbmodal({close:true}); |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
<!-- FBModal Created by Barrett at RRPowered.com --> <!-- File name index.html --> <!DOCTYPE> <html> <head> <script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"src="jquery.fbmodel.js"></script> <link rel="stylesheet" type="text/css" href="fbmodal.css" /> <title>FBModal by RRPowered.com</title> <script type="text/javascript"> $(function(){ /*When the link with the id of "open" is clicked, we will open the modal.*/ $("#open").click( function(){ /*The div with the class of "test" will be used for the modals inside content.*/ $(".test").fbmodal(); }); </script> </head> <body> <div class"test"> FBModal the first FaceBook replica dialog <a href="javascript: vaoid()" id="close" name="close">Close this dialog</a> </div> <b>Click to open:</b><a href="javascript:void()" id="open" name="open">Modal 1</a><br /> </body> </html> |
hello, your zip file is not found.
.zip not included CSS file