diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e2bd25f --- /dev/null +++ b/.gitignore @@ -0,0 +1,9 @@ +.sass-cache +.coffeescript-cache + +# OS generated files # +###################### +.DS_Store* +ehthumbs.db +Icon? +Thumbs.db diff --git a/css/images/bg.jpg b/css/images/bg.jpg deleted file mode 100644 index 2a63076..0000000 Binary files a/css/images/bg.jpg and /dev/null differ diff --git a/css/images/dlg-close.png b/css/images/dlg-close.png deleted file mode 100644 index 4de4396..0000000 Binary files a/css/images/dlg-close.png and /dev/null differ diff --git a/css/style.css b/css/style.css deleted file mode 100644 index af64587..0000000 --- a/css/style.css +++ /dev/null @@ -1,50 +0,0 @@ -body { - font-family: Georgia, serif; - font-size: 18px; - font-style: italic; - font-weight: normal; - text-transform: normal; - letter-spacing: normal; - line-height: 1.4em; - background: #222 url(images/bg.jpg); -} - -h1, h2, h3 { - font-family: Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: bold; - text-transform: normal; - letter-spacing: -1px; - line-height: 1.2em; -} - -h1 { - font-size: 34px; -} - -h2 { - font-size: 26px; -} - -h1 > span { - font-weight: normal; -} - -pre { - background: #fff; - padding: 20px; - font-size: 14px; - font-family: Courier; - font-style: normal; - border-radius: 5px; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; - -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 60px rgba(0, 0, 0, 0.1) inset; - -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; -} - -.wrapper{ - width: 800px; - margin: 40px auto; -} \ No newline at end of file diff --git a/css/topbox.css b/css/topbox.css deleted file mode 100644 index 450e3d0..0000000 --- a/css/topbox.css +++ /dev/null @@ -1,170 +0,0 @@ -/** - DEFAULTS -**/ -.topbox-window { - font-family: “Trebuchet MS”, sans-serif; - font-size: 14px; - font-style: normal; - font-weight: normal; - text-transform: normal; - letter-spacing: normal; - line-height: 1.4em; - - position: fixed; - top: 0px; - background-color: #fff; - color: #000; - - min-width: 400px; - - z-index: 1000; - -webkit-box-shadow: 0px 0px 20px #444; - -moz-box-shadow: 0px 0px 20px #444; - box-shadow: 0px 0px 20px #444; - - -webkit-border-radius: 0px 0px 8px 8px; - -moz-border-radius: 0px 0px 8px 8px; - border-radius: 0px 0px 8px 8px; -} - -.topbox-closebutton{ - background: transparent url(images/dlg-close.png) 50% 50% no-repeat; - width: 30px; - height: 30px; - cursor: pointer; - - position: absolute; - right: -15px; - top: 2px; -} - -.topbox-title{ - padding: 6px; - font-weight: bold; - background: #ddd; - border-bottom: 1px #ccc solid; -} - -.topbox-content{ - padding: 6px; -} - -.topbox-buttonsbar{ - margin: 6px; - border-top: 1px #ccc dotted; -} - -.topbox-buttons{ - padding: 6px 0px; - text-align: right; -} - -.topbox-button{ - font-size: 90%; - cursor: pointer; - color: #999; - display: inline-block; - padding: 6px 8px; - border-style: none; - background: transparent; -} - -.topbox-button:hover{ - background: #111; - color: #fff; - text-shadow: 0px -1px 1px rgba(0, 0, 0, .8), 0 1px 1px rgba(255, 255, 255, 0.3); - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; -} - -#topbox-overlay { - z-index: 999; - background: #222d3f; - opacity: 0.5; - filter:Alpha(Opacity=50); - -ms-filter:Alpha(Opacity=50); -} - - -/** STYLES - Optional **/ - -/* default */ - -.default .topbox-title{ - background: -moz-linear-gradient(0% 100% 90deg, #ddd, #eee); - background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eee), to(#ddd)); - - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#dddddd',GradientType=0 ); /* ie */ - -ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#dddddd',GradientType=0 ); /* ie 8 */ - - border-bottom: 1px #ccc solid; - text-shadow: #F4F4F4 0px 1px 0px; -} - -.default .topbox-button:hover{ - background: #111; - background: -moz-linear-gradient(0% 100% 90deg, #FFFFFF, #000000, - rgba(0, 0, 0, 0.9) 0%, - rgba(20, 20, 20, 0.9) 50%, - rgba(30, 30, 30, 0.9) 50%, - rgba(50, 50, 50, 0.9) 100%); - background: -webkit-gradient(linear, 0 0, 0 100%, - color-stop(0, rgba(50, 50, 50, 0.9)), - color-stop(0.5, rgba(30, 30, 30, 0.9)), - color-stop(0.5, rgba(20, 20, 20, 0.9)), - color-stop(1, rgba(0, 0, 0, 0.9))); - - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#111111',GradientType=0 ); /* ie */ - -ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#111111',GradientType=0 ); /* ie 8 */ - - -moz-box-shadow: inset 1px 1px 1px 0px rgba(135, 135, 135, 0.1), inset -1px -1px 1px 0px rgba(135, 135, 135, 0.1); - -webkit-box-shadow: inset 1px 1px 1px 0px rgba(135, 135, 135, 0.1), inset -1px -1px 1px 0px rgba(135, 135, 135, 0.1); - box-shadow: inset 1px 1px 1px 0px rgba(135, 135, 135, 0.1), inset -1px -1px 1px 0px rgba(135, 135, 135, 0.1); -} - -/* dark */ - -.topbox-window.dark { - background: #222; - - background: -moz-linear-gradient(top, #45484d 0%, #000000 100%); /* firefox */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45484d), color-stop(100%,#000000)); /* webkit */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* ie */ - -ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* ie */ - - color: #ccc; - border-bottom: 2px #fff solid; - border-left: 2px #fff solid; - border-right: 2px #fff solid; -} - -.dark .topbox-title{ - color: #fff; - background: transparent; - border-bottom: none; -} - -.dark .topbox-buttonsbar{ - border-top: 1px #666 dotted; -} - -/* classic */ - -.topbox-window.classic { - background-color: #eee; - color: #666; - -} - -.classic .topbox-title{ - color: #000; - background: #fff; - border-bottom: 1px #ccc solid; -} - -.classic .topbox-buttonsbar{ - border-top: none; -} - - diff --git a/images/bg.png b/images/bg.png new file mode 100644 index 0000000..60e1cd9 Binary files /dev/null and b/images/bg.png differ diff --git a/images/dlg-close.png b/images/dlg-close.png new file mode 100644 index 0000000..e138bf7 Binary files /dev/null and b/images/dlg-close.png differ diff --git a/index.html b/index.html index 42ffe4b..b0560f2 100644 --- a/index.html +++ b/index.html @@ -1,142 +1,143 @@ - - -
- -- ... a dialog alternative. -
-- - - -
- -- -
-$.topbox.show(content, {
- //settings
- 'title' : false,
- 'closeOnEsc': true,
- 'theme' : 'default',
- 'height' : 'auto',
- 'width' : 'auto',
- 'speed' : 500,
- 'easing' : 'swing',
- 'buttons' : false,
-
- //events
- 'beforeShow' : function(){},
- 'beforeClose' : function(){},
- 'onClose' : function(){}
-});
-
-
- where content could be a string, dom element or jQuery element.
-
-
- - -
-$.topbox.alert("...")
-
-
-
-
-$.topbox.confirm("...", function(){
- //your callback code
-});
-
-
-
-
-$.topbox.blockUI("...")
-
-
+ $("#btnOSX").bind("click", function(){
+
+ $.topbox.show('jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.',{
+ title: 'OSX',
+ theme: "osx",
+
+ });
+ });
-