-
contents
Type: String(HTML String)Text/HTML strings to insert to the overlay popup.
-
options
-
width
Type: StringA string width in pixels.
The width of the overlay popup. -
height
Type: StringA string height in pixels.
The height of the overlay popup. -
color (default: the colors in CSS - djc_popup_style.css)
-
overlay_div
Type: String(hexadecimal color codes or HTML color names)A color of the Div overlay.
-
overlay_opacity
Type: NumberAn opacity fo the Div overlay.
-
background
Type: String(hexadecimal color codes or HTML color names)A color of the overlay popup background.
-
font
Type: String(hexadecimal color codes or HTML color names)A color of the overlay popup font.
-
border
Type: String(hexadecimal color codes or HTML color names)A color of the overlay popup border.
-
-
btn_status
-
status (default: 0)
Type: Integer0: no button, 1: OK button, 2: Confirm & Decline buttons
-
btn_label (default: "OK")
Type: StringA label for the "OK" button.
-
btn_confirm_label (default: "Confirm")
Type: StringA label for the "Confirm" button.
-
btn_decline_label (default: "No")
Type: StringA label for the "Decline" button.
-
callback
Type: FunctionA function to call once the "OK" button is triggered.
-
confirm_callback
Type: FunctionA function to call once the "Confirm" button is triggered.
-
decline_callback
Type: FunctionA function to call once the "Decline" button is triggered.
-
-
btn_close_status
-
status (default: 1)
Type: Integer1: image button, 2: text link
-
hide (default: 1)
Type: Integer1: show close button, -1: remove close button.
-
label (default: "close")
Type: StringA label for the "close" button.
-
color (default: the color in CSS - djc_popup_style.css)
Type: String(hexadecimal color codes or HTML color names)A color for the "close" button font.
-
img (default: the background image of #djc_close in CSS)
Type: StringA path of the "close" button image.
-
-
bg_close_event (default: 0)
Type: Integer0: disabling close event for the overlay div, 1: enabling close event for the overlay div
-
beforeCallback
Type: FunctionA function to call before the overlay popup shows up.
-
afterCallback
Type: FunctionA function to call after the overlay popup shows up.
-
djc_alert()
Created: 12/23/2014
Last update: 02/15/2015 - v2
By: Jaehwan Daniel Cho
Email: danielcho80@gmail.com
Description: Show various contents(html strings) in the overlay popup.
djc_alert( contents, options )
Installation: Add following JS & CSS files.
- djc_popup_style.css:
It is a default style that affects all popups. It's possible to change the colors for the specific popup through JS color option. PIE.htc is set up for the rounded-corner in IE8 - jquery.min.js:
jQuery framework v.1.4.4 - 1.11.1 supports this overlay popup. - djc_popup-min.js:
It's the main JS file where you can define the popup position for a responsive website and the button labels as follows.
It's possible to change the labels for the specific popup through JS btn_status and btn_close_status options.
How to use: Simply add any text/html contents to the djc_alert( contents );. Also there are some options can be added to it like djc_alert( contents, options );.
Examples:
-
Default:
-
Define the Width & Height:
-
Add the "OK" button:
-
Change the label from "OK" to "Accept":
-
Add a callback function to "OK" button:
-
Add the "Confirm" & "Decline" buttons with the callback functions:
-
Change the labels for the "Confirm" & "Decline" buttons:
-
Add the close event to the overlay div:
-
Remove the close button:
-
Change the close button to the close link:
-
Change the close button image:
-
Change the colors:
-
Add the beforeCallback & afterCallback functions:
-
Add a Vimeo video:
-
Add a YouTube video:
Colors:
