lazybox 0.0.7 → 0.0.8
Sign up to get free protection for your applications and to get access to all the features.
- data/README.md +17 -2
- data/lib/lazybox/version.rb +1 -1
- data/vendor/assets/javascripts/lazybox.js +44 -28
- data/vendor/assets/stylesheets/lazybox.css +5 -5
- metadata +4 -4
data/README.md
CHANGED
@@ -4,7 +4,7 @@ Lazybox is a jQuery-based, lightbox which can display entire remote pages.
|
|
4
4
|
Use lazybox with rails 3.1 asset pipeline.
|
5
5
|
|
6
6
|
LazyBox implemented using only with css and jquery without images.
|
7
|
-
This is
|
7
|
+
This is high perfomance modal dialogs. All unpacked files take only 3 kb.
|
8
8
|
You never find simplest solution for popup windows.
|
9
9
|
|
10
10
|
# Installation
|
@@ -33,6 +33,8 @@ Include in your `app/assets/javascripts/application.js`:
|
|
33
33
|
|
34
34
|
$(document).ready(function() {
|
35
35
|
$('a[rel*=lazybox]').lazybox();
|
36
|
+
// or with options
|
37
|
+
$('a[rel*=lazybox]').lazybox({overlay: true, esc: true, close: true, modal: true, opacity: 0.3, cssClass: 'class'});
|
36
38
|
});
|
37
39
|
|
38
40
|
In your view:
|
@@ -69,9 +71,22 @@ or you can set before_filter that will disable layout for ajax requests:
|
|
69
71
|
- if @model.errors.any?
|
70
72
|
$('#lazybox_body').html("#{escape_javascript(render :partial => 'form')}");
|
71
73
|
- else
|
72
|
-
$(
|
74
|
+
$(document).trigger('close.lazybox')
|
73
75
|
window.location.reload();
|
74
76
|
|
77
|
+
# Options
|
78
|
+
|
79
|
+
overlay: true|false //default true. Show lazybox overlay.
|
80
|
+
esc: true|false //default true. Close lazybox on esc press.
|
81
|
+
close: true|false //default true. Show close lazybox button.
|
82
|
+
modal: true|false //default true. Close lazybox on overlay click.
|
83
|
+
opacity: 0.6 //default 0.3. Set opacity for lazybox overlay.
|
84
|
+
cssClass: 'class' // Set class for lazybox. <div id='lazybox' class='class'>...</div>
|
85
|
+
|
86
|
+
# Events
|
87
|
+
|
88
|
+
$(document).trigger('close.lazybox')
|
89
|
+
|
75
90
|
#
|
76
91
|
|
77
92
|
Copyright© Alex Galushka
|
data/lib/lazybox/version.rb
CHANGED
@@ -1,35 +1,51 @@
|
|
1
1
|
(function($){
|
2
|
-
$.fn.
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
2
|
+
$.fn.lazybox = function(options){
|
3
|
+
var defaults = {overlay: true, esc: true, close: true, modal: true, opacity: 0.3};
|
4
|
+
var options = $.extend(defaults, options);
|
5
|
+
|
6
|
+
this.live('click', function(e){
|
7
|
+
e.preventDefault();
|
8
|
+
if (options.overlay) {
|
7
9
|
$('body:not(:has(#lazybox_overlay))').append("<div id='lazybox_overlay' style='display:none'></div>");
|
10
|
+
$('#lazybox_overlay').css({filter: 'alpha(opacity='+options.opacity*100+')', opacity: options.opacity});
|
8
11
|
$('#lazybox_overlay').fadeIn(500);
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
12
|
+
}
|
13
|
+
|
14
|
+
$.ajax({
|
15
|
+
url: $(this).attr('href'),
|
16
|
+
success: function(data){
|
17
|
+
$('body:not(:has(#lazybox))').append("<div id='lazybox'><div id='lazybox_body'></div></div>");
|
18
|
+
if (options.cssClass) { $('#lazybox').addClass(options.cssClass) } else { $('#lazybox').removeClass(); }
|
19
|
+
if (options.close) {
|
20
|
+
$('#lazybox:not(:has(#lazybox_close))').prepend($("<a id='lazybox_close' title='close'>×</a>"));
|
21
|
+
if ($.browser.msie) $('#lazybox_close').addClass('ie');
|
22
|
+
} else $('#lazybox_close').remove();
|
23
|
+
$('#lazybox_body').html(data);
|
24
|
+
center_lazybox();
|
25
|
+
$('#lazybox').fadeIn(300);
|
26
|
+
if (!options.modal) { $('#lazybox_overlay').bind('click', function(){ close_lazybox() }) } else { $('#lazybox_overlay').unbind(); }
|
21
27
|
},
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
});
|
28
|
+
error: function(){
|
29
|
+
$('#lazybox_overlay').fadeOut(500);
|
30
|
+
}
|
26
31
|
});
|
27
|
-
}
|
28
|
-
|
29
|
-
|
32
|
+
});
|
33
|
+
|
34
|
+
if (options.close) $('#lazybox_close').live('click', function(){ close_lazybox() });
|
35
|
+
if (!options.modal && options.overlay) { $('#lazybox_overlay').bind('click', function(){ close_lazybox() }) } else { $('#lazybox_overlay').unbind(); }
|
36
|
+
$(document).keyup(function(e) { if (e.keyCode == 27 && options.esc) close_lazybox() });
|
37
|
+
}
|
30
38
|
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
}
|
39
|
+
function close_lazybox(){
|
40
|
+
$('#lazybox').fadeOut(300);
|
41
|
+
$('#lazybox_overlay').fadeOut(500);
|
42
|
+
}
|
43
|
+
|
44
|
+
function center_lazybox(){
|
45
|
+
var x = (($(window).height() - $('#lazybox').outerHeight()) / 2) + $(window).scrollTop();
|
46
|
+
$('#lazybox').css({ top: ((x < 0) ? 20 : x), left:(($(window).width() - $('#lazybox').outerWidth()) / 2) + $(window).scrollLeft() });
|
47
|
+
}
|
48
|
+
|
49
|
+
$(document).bind('close.lazybox', function(){ close_lazybox() });
|
50
|
+
})(jQuery);
|
35
51
|
|
@@ -5,7 +5,6 @@
|
|
5
5
|
bottom: 0px;
|
6
6
|
left: 0px;
|
7
7
|
right: 0px;
|
8
|
-
opacity: 0.3;
|
9
8
|
z-index: 100;
|
10
9
|
}
|
11
10
|
|
@@ -31,7 +30,7 @@
|
|
31
30
|
|
32
31
|
a#lazybox_close {
|
33
32
|
color: white;
|
34
|
-
font: bold 24px/100% Arial, Helvetica, sans-serif;
|
33
|
+
font: bold 24px/100% Arial, Helvetica, sans-serif !important;
|
35
34
|
float: right;
|
36
35
|
margin-top: -35px;
|
37
36
|
margin-right: -35px;
|
@@ -51,9 +50,10 @@ a#lazybox_close:hover { color: black; border-color: black; background: white; }
|
|
51
50
|
|
52
51
|
a#lazybox_close.ie {
|
53
52
|
border: none;
|
54
|
-
margin-top: -
|
55
|
-
margin-right: -
|
53
|
+
margin-top: -20px;
|
54
|
+
margin-right: -20px;
|
56
55
|
background: white;
|
57
56
|
color: gray;
|
58
57
|
}
|
59
|
-
|
58
|
+
|
59
|
+
a#lazybox_close.ie:hover { color: black; }
|
metadata
CHANGED
@@ -1,13 +1,13 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: lazybox
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
hash:
|
4
|
+
hash: 15
|
5
5
|
prerelease:
|
6
6
|
segments:
|
7
7
|
- 0
|
8
8
|
- 0
|
9
|
-
-
|
10
|
-
version: 0.0.
|
9
|
+
- 8
|
10
|
+
version: 0.0.8
|
11
11
|
platform: ruby
|
12
12
|
authors:
|
13
13
|
- Alex Galushka
|
@@ -15,7 +15,7 @@ autorequire:
|
|
15
15
|
bindir: bin
|
16
16
|
cert_chain: []
|
17
17
|
|
18
|
-
date: 2011-12-
|
18
|
+
date: 2011-12-07 00:00:00 Z
|
19
19
|
dependencies:
|
20
20
|
- !ruby/object:Gem::Dependency
|
21
21
|
name: rails
|