-
Notifications
You must be signed in to change notification settings - Fork 0
ajayhada/SimpleDialog
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
A Simple flexible customizable jquery popup dialogbox plugin. ************* ## Plugin Methods ************ 1. selector.showpopup(settings); // to create(show) popup dialog box 2. selector.closepopup(id); // to close specific popup dialog box 3. selector.closeAllpopup(); // to close all popup diabog box instances ## Settings parameter description Settings{ left: 100, // left position of dialog box'' top: 100, // top position of dialog box hideinterval: 0, // can provide auto hide interval hideOnClick: false, // set true to hide popup on click draggable: true, // set this flag true to make dialog draggable draggableContainer: "document", // set dialog draggable boundaries , default is document, you can pass $("#divid") enableclose:true, // set true to show close link closeIcon:"close_icon.jpg", // set close icon ismodal: true, // create model dialog overlayStyle:{ opacity: 0.1, // set opacity for overlay background:'black', // set overlay div color extraCSS:'' // set css properites to customize overlay css }, popupStyle:{ border: 3, // border width of dialog box bordercolor: '#000', // border color of dialog box borderradius: 10, // border radius of dialog // do not work in IE background:'#dddddd', // dialogbox background color. extraCSS:'' // you can provide extra css properties to customize popup window } } *** ## How to use ? ### Include libraries <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script> <script type="text/javascript" src="https://github.com/downloads/ajayhada/SimpleDialog/SimpleDialog-2.0.js"></script> *** ### Write a popup div <div class="Hello" style="display:none;"> <h1>Hello guys</h1> <b>Hello guys</b> <b>Hello guys</b> </div> ### write show hide methods function closePopup(){ $('.Hello').closeAllpopup(); } function show(){ $('.Hello').showpopup({enableclose:true,closeIcon:"close_icon.gif",ismodal:true,overlayStyle:{background:"RED"}}); } ### Create an event to show the popup <button onclick="show();">Click to open popup box</button> ***
About
Simple dialog box jquery plugin
Resources
Stars
Watchers
Forks
Releases
No releases published
Packages 0
No packages published