Difference between revisions of "FancyBox"
(how to use fancybox.) |
|||
Line 10: | Line 10: | ||
== Using == | == Using == | ||
=== Initialising === | |||
Inside of the document's ready function, the following code needs to exist, to initialise each link that is supposed to open a fancybox: | |||
$(document).ready(function(){ | |||
// initialise fancy box | |||
enable_modals(); | |||
// initialise a link | |||
$(".linkclass_modal").fancybox( { | |||
'overlayOpacity' : 0.0, | |||
'showCloseButton' : true, | |||
'frameHeight' : 400, | |||
'frameWidth' : 500 | |||
}); | |||
}); | |||
=== Using with a link === | |||
To open a page into a fancybox, a link must either be clicked, or have its 'click' handler triggered. | |||
This link (an 'a' entity) must have two classes associated with it: 'iframe', and the same ID supplied in the initialisation (linkclass_modal in our example). | |||
=== Using inside of an onclick() === | |||
To open a page from an onclick() handler, its necessary to trigger the 'click' handle of an invisible link. | |||
for example: | |||
function popupfancybox() { | |||
$("a.findpatient_modal").trigger("click"); | |||
} | |||
<nowiki> <div style="display: none;"></nowiki> | |||
<nowiki> <a class="iframe findpatient_modal" href="find_patient_popup.php"></a></nowiki> | |||
<nowiki> </div></nowiki><br> | |||
== Users == | == Users == |
Revision as of 08:39, 21 December 2012
FancyBox In OpenEMR
Fancybox is used in OpenEMR as a replacement for pop-up windows. popups are becoming deprecated in modern browsers, and the window.close() function used to make a popup disappear is disabled in at least one browser.
Versions
Two versions of FancyBox exist in the OpenEMR codebase.
Integrating these two versions is not a big priority, see thread: http://osdir.com/ml/fancybox/2011-12/msg00192.html .
For new code, it is preferred to use the 1.3.4 version, rather than the 1.2.6 version.
Using
Initialising
Inside of the document's ready function, the following code needs to exist, to initialise each link that is supposed to open a fancybox:
$(document).ready(function(){ // initialise fancy box enable_modals(); // initialise a link $(".linkclass_modal").fancybox( { 'overlayOpacity' : 0.0, 'showCloseButton' : true, 'frameHeight' : 400, 'frameWidth' : 500 }); });
Using with a link
To open a page into a fancybox, a link must either be clicked, or have its 'click' handler triggered.
This link (an 'a' entity) must have two classes associated with it: 'iframe', and the same ID supplied in the initialisation (linkclass_modal in our example).
Using inside of an onclick()
To open a page from an onclick() handler, its necessary to trigger the 'click' handle of an invisible link.
for example:
function popupfancybox() { $("a.findpatient_modal").trigger("click"); } <div style="display: none;"> <a class="iframe findpatient_modal" href="find_patient_popup.php"></a> </div>