https://nebaarukun.info/js/lib/jquery.lightbox_me/jquery.lightbox_me.js

1/*
2* $ lightbox_me
3* By: Buck Wilson
4* Version : 2.3
5*
6* Licensed under the Apache License, Version 2.0 (the "License");
7* you may not use this file except in compliance with the License.
8* You may obtain a copy of the License at
9*
10*     http://www.apache.org/licenses/LICENSE-2.0
11*
12* Unless required by applicable law or agreed to in writing, software
13* distributed under the License is distributed on an "AS IS" BASIS,
14* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15* See the License for the specific language governing permissions and
16* limitations under the License.
17*/
18
19
20(function($) {
21
22    $.fn.lightbox_me = function(options) {
23
24        return this.each(function() {
25
26            var
27                opts = $.extend({}, $.fn.lightbox_me.defaults, options),
28                $overlay = $(),
29                $self = $(this),
30                $iframe = $('<iframe id="foo" style="z-index: ' + (opts.zIndex + 1) + ';border: none; margin: 0; padding: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0; filter: mask();"/>');
31//ie6 = ($.browser.msie && $.browser.version < 7);
32var ie6 = false;
33if(!jQuery.support.opacity){
34  if(!jQuery.support.style) {
35    if(typeof document.documentElement.style.maxHeight != "undefined") {
36      //ie7
37    } else {
38      //ie6
39      ie6 = true;
40    }
41  }
42}
43
44
45            if (opts.showOverlay) {
46                //check if there's an existing overlay, if so, make subequent ones clear
47               var $currentOverlays = $(".js_lb_overlay:visible");
48                if ($currentOverlays.length > 0){
49                    $overlay = $('<div class="lb_overlay_clear js_lb_overlay"/>');
50                } else {
51                    $overlay = $('<div class="' + opts.classPrefix + '_overlay js_lb_overlay"/>');
52                }
53            }
54
55            /*----------------------------------------------------
56               DOM Building
57            ---------------------------------------------------- */
58            if (ie6) {
59                var src = /^https/i.test(window.location.href || '') ? 'javascript:false' : 'about:blank';
60                $iframe.attr('src', src);
61                $('body').append($iframe);
62            } // iframe shim for ie6, to hide select elements
63            $('body').append($self.hide()).append($overlay);
64
65
66            /*----------------------------------------------------
67               Overlay CSS stuffs
68            ---------------------------------------------------- */
69
70            // set css of the overlay
71            if (opts.showOverlay) {
72                setOverlayHeight(); // pulled this into a function because it is called on window resize.
73                $overlay.css({ position: 'absolute', width: '100%', top: 0, left: 0, right: 0, bottom: 0, zIndex: (opts.zIndex + 2), display: 'none' });
74				if (!$overlay.hasClass('lb_overlay_clear')){
75                	$overlay.css(opts.overlayCSS);
76                }
77            }
78
79            /*----------------------------------------------------
80               Animate it in.
81            ---------------------------------------------------- */
82               //
83            if (opts.showOverlay) {
84                $overlay.fadeIn(opts.overlaySpeed, function() {
85                    setSelfPosition();
86                    $self[opts.appearEffect](opts.lightboxSpeed, function() { setOverlayHeight(); setSelfPosition(); opts.onLoad()});
87                });
88            } else {
89                setSelfPosition();
90                $self[opts.appearEffect](opts.lightboxSpeed, function() { opts.onLoad()});
91            }
92
93            /*----------------------------------------------------
94               Hide parent if parent specified (parentLightbox should be jquery reference to any parent lightbox)
95            ---------------------------------------------------- */
96            if (opts.parentLightbox) {
97                opts.parentLightbox.fadeOut(200);
98            }
99
100
101            /*----------------------------------------------------
102               Bind Events
103            ---------------------------------------------------- */
104
105            $(window).resize(setOverlayHeight)
106                     .resize(setSelfPosition)
107                     .scroll(setSelfPosition);
108                     
109            $(window).bind('keyup.lightbox_me', observeKeyPress);
110                     
111            if (opts.closeClick) {
112                $overlay.click(function(e) { closeLightbox(); e.preventDefault; });
113            }
114            $self.delegate(opts.closeSelector, "click", function(e) {
115                closeLightbox(); e.preventDefault();
116            });
117            $self.bind('close', closeLightbox);
118            $self.bind('reposition', setSelfPosition);
119
120            
121
122            /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
123              -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
124
125
126            /*----------------------------------------------------
127               Private Functions
128            ---------------------------------------------------- */
129
130            /* Remove or hide all elements */
131            function closeLightbox() {
132                var s = $self[0].style;
133                if (opts.destroyOnClose) {
134                    $self.add($overlay).remove();
135                } else {
136                    $self.add($overlay).hide();
137                }
138
139                //show the hidden parent lightbox
140                if (opts.parentLightbox) {
141                    opts.parentLightbox.fadeIn(200);
142                }
143
144                $iframe.remove();
145                
146				// clean up events.
147                $self.undelegate(opts.closeSelector, "click");
148
149                $(window).unbind('reposition', setOverlayHeight);
150                $(window).unbind('reposition', setSelfPosition);
151                $(window).unbind('scroll', setSelfPosition);
152                $(window).unbind('keyup.lightbox_me');
153                if (ie6)
154                    s.removeExpression('top');
155                opts.onClose();
156            }
157
158
159            /* Function to bind to the window to observe the escape/enter key press */
160            function observeKeyPress(e) {

161                if((e.keyCode == 27 || (e.DOM_VK_ESCAPE == 27 && e.which==0)) && opts.closeEsc) closeLightbox();
162            }
163
164
165            /* Set the height of the overlay
166                    : if the document height is taller than the window, then set the overlay height to the document height.
167                    : otherwise, just set overlay height: 100%
168            */
169            function setOverlayHeight() {
170                $overlay.css({height: $(document).height()+150 + 'px'});
171                $iframe.css({height: $(document).height() + 'px'}); 
172/*
173                if ($(window).height() < $(document).height()) {
174                    $overlay.css({height: $(document).height() + 'px'});
175                     $iframe.css({height: $(document).height() + 'px'}); 
176                } else {
177                    $overlay.css({height: '100%'});
178                    if (ie6) {
179                        $('html,body').css('height','100%');
180                        $iframe.css('height', '100%');
181                    } // ie6 hack for height: 100%; TODO: handle this in IE7
182                }
183*/
184            }
185
186
187            /* Set the position of the modal'd window ($self)
188                    : if $self is taller than the window, then make it absolutely positioned
189                    : otherwise fixed
190            */
191            function setSelfPosition() {
192                var s = $self[0].style;
193
194                // reset CSS so width is re-calculated for margin-left CSS
195                $self.css({left: '50%', marginLeft: ($self.outerWidth() / 2) * -1,  zIndex: (opts.zIndex + 3) });
196
197
198                /* we have to get a little fancy when dealing with height, because lightbox_me
199                    is just so fancy.
200                 */
201
202                // if the height of $self is bigger than the window and self isn't already position absolute
203                if (($self.height() + 80  >= $(window).height()) && ($self.css('position') != 'absolute' || ie6)) {
204
205                    // we are going to make it positioned where the user can see it, but they can still scroll
206                    // so the top offset is based on the user's scroll position.
207                    var topOffset = $(document).scrollTop() + 40;
208                    $self.css({position: 'absolute', top: topOffset + 'px', marginTop: 0})
209                    if (ie6) {
210                        s.removeExpression('top');
211                    }
212                } else if ($self.height()+ 80  < $(window).height()) {
213                    //if the height is less than the window height, then we're gonna make this thing position: fixed.
214                    // in ie6 we're gonna fake it.
215                    if (ie6) {
216                        s.position = 'absolute';
217                        if (opts.centered) {
218                            s.setExpression('top', '(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"')
219                            s.marginTop = 0;
220                        } else {
221                            var top = (opts.modalCSS && opts.modalCSS.top) ? parseInt(opts.modalCSS.top) : 0;
222                            s.setExpression('top', '((blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + '+top+') + "px"')
223                        }
224                    } else {
225                        if (opts.centered) {
226                            $self.css({ position: 'fixed', top: '50%', marginTop: ($self.outerHeight() / 2) * -1})
227                        } else {
228                            $self.css({ position: 'fixed'}).css(opts.modalCSS);
229                        }
230
231                    }
232                }
233            }
234
235        });
236
237
238
239    };
240
241    $.fn.lightbox_me.defaults = {
242
243        // animation
244        appearEffect: "fadeIn",
245        appearEase: "",
246        overlaySpeed: 250,
247        lightboxSpeed: 300,
248
249        // close
250        closeSelector: ".close",
251        closeClick: true,
252        closeEsc: true,
253
254        // behavior
255        destroyOnClose: false,
256        showOverlay: true,
257        parentLightbox: false,
258
259        // callbacks
260        onLoad: function() {},
261        onClose: function() {},
262
263        // style
264        classPrefix: 'lb',
265        zIndex: 999,
266        centered: false,
267        modalCSS: {top: '40px'},
268        overlayCSS: {background: 'black', opacity: .3}
269    }
270})(jQuery);