JQuery Dialogize (Navigation)

  • This plugin can "DIALOGIZE" all, most important the option "TYPE"
    that defines the type of content to dialogize

    • “empty” > this generates your dialogBox with your “content”,
    • “pdf” —> the dialogBox becomes a pdf Reader, its path is pdf_src option
    • “img” —> in this case dialogBox becomes a zoom image…. N.B. there is another plugin that provide to image resize
    • “confirm”—> the dialogBox becomes a confirm form whith button “YES” or “NO” and function of callback
  • callback functions are available before the dialog is opened and/or after is closed
  • some css styles via js code
  • different color and images for each dialog type
  • draggable and resizable dialogs
  • You can specify a precise width/height to dialog else pluging do it automatically depending on window size

And more…. (SEE “LIST OF AVAILABLE OPTIONS ”)

LIST OF AVAILABLE OPTIONS :

Name Type Default What Does
content STRING ’’ content of dialog box (HTML/TEXT or JQUERY SELECTOR eg:. $(’#some_id’).html())
pdf_src STRING ’’ path of pdf that you want read, this option is valid only if type = “pdf”
type STRING ’’ type of dialog: pay attention:
this option can have different value:
1) “empty” > this generates your dialogBox with your “content”
2) “pdf” —> the dialogBox becomes a pdf Reader, its path is pdf_src option
3) “img” —> in this case dialogBox becomes a zoom image…. N.B. there is another plugin that provide to image resize
4) “confirm”—> the dialogBox becomes a confirm form whith button “YES” or “NO” and function of callback
img_dial STRING ’’ you can put an image before your content (NOT PATH BUT ENTIRE TAG )
eg:. < img src=”……” />
delay_close NUMBER ’’ this is delay in milliseconds before closing dialogBox (IF THIS OPTION NOT empty then option “CLOSABLE” is not aviable)
closable BOLEAN true indicates if dialogBox can be closed (IF DELAY NOT NULL THIS OPTION = FALSE )
overlay BOLEAN true overlay for dialogBox
color_overlay STRING #666 color of overlay
overlay_opacity NUMBER 3 opacity of overlay
resizable BOLEAN true if true , dialogBox is resizable .if you dont have jquery UI, plugin go on without resize
draggable BOLEAN true if true , dialogBox is draggable .if you dont have jquery UI, plugin go on without drag
before_open_dial FUNCTION ’’ function/s that are triggered immediately before dialogBox is opened
post_close_dial FUNCTION ’’ function/s that are triggered immediately after dialogBox is closed
confirm FUNCTION ’’ function/s that are triggered immediately after button “YES” is clicked
img_scr_close STRING ’’ image of close button (NOT PATH BUT ENTIRE TAG ) eg:. < img src=”……” />
text_close STRING ‘Close’ text of close button
w_dial NUMBER ’’ You can specify a precise width to dialogBox else pluging do it automatically depending on window size
h_dial NUMBER ’’ You can specify a precise height to dialogBox else pluging do it automatically depending on window size
text_yes STRING ‘YES’ text of YES button
text_no STRING ‘NO’ text of NO button
class_button_yes STRING ’’ you can add more class to YES buttont, give them an interspace eg:. “class1 class2 class3”
class_button_no STRING ’’ you can add more class to NO buttont, give them an interspace eg:. “class1 class2 class3”
other_class_container STRING ’’ you can add more class to container of content, give them an interspace eg:. “class1 class2 class3”
other_class_content STRING ’’ you can add more class to content, give them an interspace eg:. “class1 class2 class3”
other_class_close STRING ’’ you can add more class to close button, give them an interspace eg:. “class1 class2 class3”
CSS OPTION VIA OPTION
/*/
/
List of available css options for dialog container /
/
/
border:true,
border_size: ‘5’,
border_color: ’#33ccff’,
border_radius:true,
border_radius_size:’8’,
shadow: true,
shadow_size:’30’,

shadow_color:’#666’,

/*/
/
List of available css options for dialog content /
/
/

color:’#666’,
background:’#fff’,
text_align:’left’,

/*/
/
List of available css options for close button /
/
/
background_close:’#33ccff’,
font_color_close:’#fff’,
METHOD
$.dialogize(‘destroy’)—> this method provides to destroy all opened dialogs
it’s called when you close a dialog

Download JQuery Dialogize (Navigation)

Leave a Reply

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