Upgrade to joverlay 0.8 (needed the html option)
This commit is contained in:
Craig Andrews
parent
377f95a20f
commit
aadb4f2093
|
|
@ -1,6 +1,6 @@
|
|||
/* Copyright (c) 2009 Alvaro A. Lima Jr http://alvarojunior.com/jquery/joverlay.html
|
||||
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
|
||||
* Version: 0.7.1 (JUN 15, 2009)
|
||||
* Version: 0.8 (OUT 19, 2009)
|
||||
* Requires: jQuery 1.3+
|
||||
*/
|
||||
|
||||
|
|
@ -9,43 +9,54 @@
|
|||
// Global vars
|
||||
var isIE6 = $.browser.msie && $.browser.version == 6.0; // =(
|
||||
var JOVERLAY_TIMER = null;
|
||||
var JOVERLAY_ELEMENT_PREV = null;
|
||||
|
||||
$.fn.jOverlay = function(options) {
|
||||
|
||||
// Element exist?
|
||||
if ( $('#jOverlay').length ) {$.closeOverlay();}
|
||||
|
||||
// Clear Element Prev
|
||||
JOVERLAY_ELEMENT_PREV = null;
|
||||
|
||||
// Clear Timer
|
||||
if (JOVERLAY_TIMER !== null) {
|
||||
clearTimeout( JOVERLAY_TIMER );
|
||||
}
|
||||
|
||||
// Set Options
|
||||
var options = $.extend({}, $.fn.jOverlay.options, options);
|
||||
var options = $.extend({}, $.fn.jOverlay.options, options || {});
|
||||
|
||||
// success deprecated !!! Use onSuccess
|
||||
var onSuccess = options.onSuccess || options.success;
|
||||
|
||||
var element = this.is('*') ? this : '#jOverlayContent';
|
||||
|
||||
var position = isIE6 ? 'absolute' : 'fixed';
|
||||
|
||||
var isImage = /([^\/\\]+)\.(png|gif|jpeg|jpg|bmp)$/i.test( options.url );
|
||||
|
||||
var imgLoading = options.imgLoading ? "<img id='jOverlayLoading' src='"+options.imgLoading+"' style='position:"+position+"; z-index:"+(options.zIndex + 9)+";'/>" : '';
|
||||
|
||||
// private function
|
||||
function center(id) {
|
||||
if (options.center) {
|
||||
$.center(id);
|
||||
} else if( isIE6 ) {
|
||||
$.center('#jOverlayContent',{
|
||||
'top' : $(window).scrollTop() + 'px',
|
||||
'marginLeft' : '',
|
||||
'marginTop' : '',
|
||||
'left' : ''
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
var element = this.is('*') ? this : '#jOverlayContent';
|
||||
var position = isIE6 ? 'absolute' : 'fixed';
|
||||
var isImage = /([^\/\\]+)\.(png|gif|jpeg|jpg|bmp)$/i.test( options.url );
|
||||
|
||||
var imgLoading = options.imgLoading ? "<img id='jOverlayLoading' src='"+options.imgLoading+"' style='position:"+position+"; z-index:"+(options.zIndex + 9)+";'/>" : '';
|
||||
|
||||
$('body').prepend(imgLoading + "<div id='jOverlay' />"
|
||||
+ "<div id='jOverlayContent' style='position:"+position+"; z-index:"+(options.zIndex + 5)+"; display:none;'/>"
|
||||
);
|
||||
|
||||
// Cache options
|
||||
$('#jOverlayContent').data('options', options);
|
||||
|
||||
// Loading Centered
|
||||
$('#jOverlayLoading').load(function(){
|
||||
$('#jOverlayLoading').load(function() {
|
||||
center(this);
|
||||
});
|
||||
|
||||
|
|
@ -57,35 +68,42 @@
|
|||
|
||||
// Overlay Style
|
||||
$('#jOverlay').css({
|
||||
backgroundColor : options.color,
|
||||
position : position,
|
||||
top : '0px',
|
||||
left : '0px',
|
||||
filter : 'alpha(opacity='+ (options.opacity * 100) +')', // IE =(
|
||||
opacity : options.opacity, // Good Browser =D
|
||||
zIndex : options.zIndex,
|
||||
width : !isIE6 ? '100%' : $(window).width() + 'px',
|
||||
height : !isIE6 ? '100%' : $(document).height() + 'px'
|
||||
'backgroundColor' : options.color,
|
||||
'position' : position,
|
||||
'top' : '0px',
|
||||
'left' : '0px',
|
||||
'filter' : 'alpha(opacity='+ (options.opacity * 100) +')', // IE =(
|
||||
'opacity' : options.opacity, // Good Browser =D
|
||||
'-khtml-opacity' : options.opacity,
|
||||
'-moz-opacity' : options.opacity,
|
||||
'zIndex' : options.zIndex,
|
||||
'width' : !isIE6 ? '100%' : $(window).width() + 'px',
|
||||
'height' : !isIE6 ? '100%' : $(document).height() + 'px'
|
||||
}).show();
|
||||
|
||||
// INNER HTML
|
||||
if ( $.trim(options.html) ) {
|
||||
$(element).html(options.html);
|
||||
}
|
||||
|
||||
// ELEMENT
|
||||
if ( this.is('*') ) {
|
||||
|
||||
JOVERLAY_ELEMENT_PREV = this.prev();
|
||||
$('#jOverlayContent').data('jOverlayElementPrev', this.prev() );
|
||||
|
||||
$('#jOverlayContent').html(
|
||||
this.show().attr('display', options.autoHide ? 'none' : this.css('display') )
|
||||
this.show().data('display', options.autoHide ? 'none' : this.css('display') )
|
||||
);
|
||||
|
||||
|
||||
if ( !isImage ) {
|
||||
|
||||
center('#jOverlayContent');
|
||||
|
||||
$('#jOverlayContent').show();
|
||||
|
||||
|
||||
// Execute callback
|
||||
if ( !options.url && $.isFunction( options.success ) ) {
|
||||
options.success( this );
|
||||
if ( !options.url && $.isFunction( onSuccess ) ) {
|
||||
onSuccess( this );
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -106,13 +124,14 @@
|
|||
$( element ).html(this);
|
||||
|
||||
center('#jOverlayContent');
|
||||
center('#jOverlayLoading');
|
||||
|
||||
$('#jOverlayLoading').fadeOut(500);
|
||||
$('#jOverlayContent').show();
|
||||
|
||||
// Execute callback
|
||||
if ( $.isFunction( options.success ) ) {
|
||||
options.success( this );
|
||||
if ( $.isFunction( onSuccess ) ) {
|
||||
onSuccess( $(element) );
|
||||
}
|
||||
|
||||
}).error(function(){
|
||||
|
|
@ -138,8 +157,8 @@
|
|||
center('#jOverlayContent');
|
||||
|
||||
// Execute callback
|
||||
if ($.isFunction( options.success )) {
|
||||
options.success(responseText);
|
||||
if ( $.isFunction( onSuccess ) ) {
|
||||
onSuccess( responseText );
|
||||
}
|
||||
|
||||
},
|
||||
|
|
@ -163,8 +182,8 @@
|
|||
$(window).resize(function(){
|
||||
|
||||
$('#jOverlay').css({
|
||||
width: $(window).width() + 'px',
|
||||
height: $(document).height() + 'px'
|
||||
'width' : $(window).width() + 'px',
|
||||
'height' : $(document).height() + 'px'
|
||||
});
|
||||
|
||||
center('#jOverlayContent');
|
||||
|
|
@ -174,11 +193,15 @@
|
|||
}
|
||||
|
||||
// Press ESC to close
|
||||
$(document).keydown(function(event){
|
||||
if (event.keyCode == 27) {
|
||||
$.closeOverlay();
|
||||
}
|
||||
});
|
||||
if ( options.closeOnEsc ) {
|
||||
$(document).keydown(function(event){
|
||||
if ( event.keyCode == 27 ) {
|
||||
$.closeOverlay();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
$(document).unbind('keydown');
|
||||
}
|
||||
|
||||
// Click to close
|
||||
if ( options.bgClickToClose ) {
|
||||
|
|
@ -188,12 +211,13 @@
|
|||
// Timeout (auto-close)
|
||||
// time in millis to wait before auto-close
|
||||
// set to 0 to disable
|
||||
if ( Number(options.timeout) > 0 ) {
|
||||
jOverlayTimer = setTimeout( $.closeOverlay, Number(options.timeout) );
|
||||
if ( options.timeout && Number(options.timeout) > 0 ) {
|
||||
JOVERLAY_TIMER = window.setTimeout( $.closeOverlay, Number(options.timeout) );
|
||||
}
|
||||
|
||||
// ADD CSS
|
||||
$('#jOverlayContent').css(options.css || {});
|
||||
|
||||
};
|
||||
|
||||
// Resizing large images - orginal by Christian Montoya.
|
||||
|
|
@ -202,68 +226,87 @@
|
|||
var x = $(window).width() - 150;
|
||||
var y = $(window).height() - 150;
|
||||
if (imageWidth > x) {
|
||||
imageHeight = imageHeight * (x / imageWidth);
|
||||
imageWidth = x;
|
||||
if (imageHeight > y) {
|
||||
imageWidth = imageWidth * (y / imageHeight);
|
||||
imageHeight = y;
|
||||
imageHeight = imageHeight * (x / imageWidth);
|
||||
imageWidth = x;
|
||||
if (imageHeight > y) {
|
||||
imageWidth = imageWidth * (y / imageHeight);
|
||||
imageHeight = y;
|
||||
}
|
||||
} else if (imageHeight > y) {
|
||||
imageWidth = imageWidth * (y / imageHeight);
|
||||
imageHeight = y;
|
||||
if (imageWidth > x) {
|
||||
imageHeight = imageHeight * (x / imageWidth);
|
||||
} else if (imageHeight > y) {
|
||||
imageWidth = imageWidth * (y / imageHeight);
|
||||
imageHeight = y;
|
||||
if (imageWidth > x) {
|
||||
imageHeight = imageHeight * (x / imageWidth);
|
||||
imageWidth = x;
|
||||
}
|
||||
}
|
||||
return {width:imageWidth, height:imageHeight};
|
||||
return {'width':imageWidth, 'height':imageHeight};
|
||||
};
|
||||
|
||||
// Centered Element
|
||||
$.center = function(element) {
|
||||
$.center = function(element, css) {
|
||||
var element = $(element);
|
||||
var elemWidth = element.width();
|
||||
|
||||
element.css({
|
||||
width : elemWidth + 'px',
|
||||
marginLeft : '-' + (elemWidth / 2) + 'px',
|
||||
marginTop : '-' + element.height() / 2 + 'px',
|
||||
height : 'auto',
|
||||
top : !isIE6 ? '50%' : $(window).scrollTop() + ($(window).height() / 2) + 'px',
|
||||
left : '50%'
|
||||
});
|
||||
element.css($.extend({},{
|
||||
'width' : elemWidth + 'px',
|
||||
'marginLeft' : '-' + (elemWidth / 2) + 'px',
|
||||
'marginTop' : '-' + element.height() / 2 + 'px',
|
||||
'height' : 'auto',
|
||||
'top' : !isIE6 ? '50%' : $(window).scrollTop() + ($(window).height() / 2) + 'px',
|
||||
'left' : '50%'
|
||||
}, css || {}));
|
||||
};
|
||||
|
||||
// Options default
|
||||
$.fn.jOverlay.options = {
|
||||
method : 'GET',
|
||||
data : '',
|
||||
url : '',
|
||||
color : '#000',
|
||||
opacity : '0.6',
|
||||
zIndex : 9999,
|
||||
center : true,
|
||||
imgLoading : '',
|
||||
bgClickToClose : true,
|
||||
success : null,
|
||||
timeout : 0,
|
||||
autoHide : true,
|
||||
css : {}
|
||||
'method' : 'GET',
|
||||
'data' : '',
|
||||
'url' : '',
|
||||
'color' : '#000',
|
||||
'opacity' : '0.6',
|
||||
'zIndex' : 9999,
|
||||
'center' : true,
|
||||
'imgLoading' : '',
|
||||
'bgClickToClose' : true,
|
||||
'success' : null, // Deprecated : use onSuccess
|
||||
'onSuccess' : null,
|
||||
'timeout' : 0,
|
||||
'autoHide' : true,
|
||||
'css' : {},
|
||||
'html' : '',
|
||||
'closeOnEsc' : true
|
||||
};
|
||||
|
||||
// Set default options (GLOBAL)
|
||||
// Overiding the default values.
|
||||
$.fn.jOverlay.setDefaults = function(options) {
|
||||
$.fn.jOverlay.options = $.extend({}, $.fn.jOverlay.options, options || {});
|
||||
};
|
||||
|
||||
// Close
|
||||
$.closeOverlay = function() {
|
||||
|
||||
var content = $('#jOverlayContent');
|
||||
var options = content.data('options');
|
||||
var elementPrev = content.data('jOverlayElementPrev');
|
||||
|
||||
// Fix IE6 (SELECT)
|
||||
if (isIE6) { $("select").show(); }
|
||||
|
||||
if ( JOVERLAY_ELEMENT_PREV !== null ) {
|
||||
if ( JOVERLAY_ELEMENT_PREV !== null ) {
|
||||
var element = $('#jOverlayContent').children();
|
||||
JOVERLAY_ELEMENT_PREV.after( element.css('display', element.attr('display') ) );
|
||||
element.removeAttr('display');
|
||||
}
|
||||
// Restore position
|
||||
if ( elementPrev ) {
|
||||
var contentChildren = content.children();
|
||||
elementPrev.after( contentChildren.css('display', contentChildren.data('display') ) );
|
||||
// Clear cache
|
||||
contentChildren.removeData('display');
|
||||
content.removeData('jOverlayElementPrev');
|
||||
}
|
||||
|
||||
// Clear options cache
|
||||
content.removeData('options');
|
||||
|
||||
// Remove joverlay elements
|
||||
$('#jOverlayLoading, #jOverlayContent, #jOverlay').remove();
|
||||
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/* Copyright (c) 2009 Alvaro A. Lima Jr http://alvarojunior.com/jquery/joverlay.html
|
||||
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
|
||||
* Version: 0.7.1 (JUN 15, 2009
|
||||
* Version: 0.8 (OUT 19, 2009)
|
||||
* Requires: jQuery 1.3+
|
||||
* Packer from http://dean.edwards.name/packer/
|
||||
*/
|
||||
(function($){var g=$.browser.msie&&$.browser.version==6.0;var h=null;var i=null;$.fn.jOverlay=function(b){if($('#jOverlay').length){$.closeOverlay()}i=null;if(h!==null){clearTimeout(h)}var b=$.extend({},$.fn.jOverlay.options,b);function center(a){if(b.center){$.center(a)}}var c=this.is('*')?this:'#jOverlayContent';var d=g?'absolute':'fixed';var e=/([^\/\\]+)\.(png|gif|jpeg|jpg|bmp)$/i.test(b.url);var f=b.imgLoading?"<img id='jOverlayLoading' src='"+b.imgLoading+"' style='position:"+d+"; z-index:"+(b.zIndex+9)+";'/>":'';$('body').prepend(f+"<div id='jOverlay' />"+"<div id='jOverlayContent' style='position:"+d+"; z-index:"+(b.zIndex+5)+"; display:none;'/>");$('#jOverlayLoading').load(function(){center(this)});if(g){$('select').hide();$('#jOverlayContent select').show()}$('#jOverlay').css({backgroundColor:b.color,position:d,top:'0px',left:'0px',filter:'alpha(opacity='+(b.opacity*100)+')',opacity:b.opacity,zIndex:b.zIndex,width:!g?'100%':$(window).width()+'px',height:!g?'100%':$(document).height()+'px'}).show();if(this.is('*')){i=this.prev();$('#jOverlayContent').html(this.show().attr('display',b.autoHide?'none':this.css('display')));if(!e){center('#jOverlayContent');$('#jOverlayContent').show();if(!b.url&&$.isFunction(b.success)){b.success(this)}}}if(e){$('<img/>').load(function(){var a=$.resize(this.width,this.height);$(this).css({width:a.width,height:a.height});$(c).html(this);center('#jOverlayContent');$('#jOverlayLoading').fadeOut(500);$('#jOverlayContent').show();if($.isFunction(b.success)){b.success(this)}}).error(function(){alert('Image ('+b.url+') not found.');$.closeOverlay()}).attr({'src':b.url,'alt':b.url})}if(b.url&&!e){$.ajax({type:b.method,data:b.data,url:b.url,success:function(a){$('#jOverlayLoading').fadeOut(500);$(c).html(a).show();center('#jOverlayContent');if($.isFunction(b.success)){b.success(a)}},error:function(){alert('URL ('+b.url+') not found.');$.closeOverlay()}})}if(g){$(window).scroll(function(){center('#jOverlayContent')});$(window).resize(function(){$('#jOverlay').css({width:$(window).width()+'px',height:$(document).height()+'px'});center('#jOverlayContent')})}$(document).keydown(function(a){if(a.keyCode==27){$.closeOverlay()}});if(b.bgClickToClose){$('#jOverlay').click($.closeOverlay)}if(Number(b.timeout)>0){jOverlayTimer=setTimeout($.closeOverlay,Number(b.timeout))}$('#jOverlayContent').css(b.css||{})};$.resize=function(a,b){var x=$(window).width()-150;var y=$(window).height()-150;if(a>x){b=b*(x/a);a=x;if(b>y){a=a*(y/b);b=y}}else if(b>y){a=a*(y/b);b=y;if(a>x){b=b*(x/a);a=x}}return{width:a,height:b}};$.center=function(a){var a=$(a);var b=a.width();a.css({width:b+'px',marginLeft:'-'+(b/2)+'px',marginTop:'-'+a.height()/2+'px',height:'auto',top:!g?'50%':$(window).scrollTop()+($(window).height()/2)+'px',left:'50%'})};$.fn.jOverlay.options={method:'GET',data:'',url:'',color:'#000',opacity:'0.6',zIndex:9999,center:true,imgLoading:'',bgClickToClose:true,success:null,timeout:0,autoHide:true,css:{}};$.closeOverlay=function(){if(g){$("select").show()}if(i!==null){if(i!==null){var a=$('#jOverlayContent').children();i.after(a.css('display',a.attr('display')));a.removeAttr('display')}}$('#jOverlayLoading, #jOverlayContent, #jOverlay').remove()}})(jQuery);
|
||||
(function($){var isIE6=$.browser.msie&&$.browser.version==6.0;var JOVERLAY_TIMER=null;$.fn.jOverlay=function(options){if($('#jOverlay').length){$.closeOverlay()}if(JOVERLAY_TIMER!==null){clearTimeout(JOVERLAY_TIMER)}var options=$.extend({},$.fn.jOverlay.options,options||{});var onSuccess=options.onSuccess||options.success;var element=this.is('*')?this:'#jOverlayContent';var position=isIE6?'absolute':'fixed';var isImage=/([^\/\\]+)\.(png|gif|jpeg|jpg|bmp)$/i.test(options.url);var imgLoading=options.imgLoading?"<img id='jOverlayLoading' src='"+options.imgLoading+"' style='position:"+position+"; z-index:"+(options.zIndex+9)+";'/>":'';function center(id){if(options.center){$.center(id)}else if(isIE6){$.center('#jOverlayContent',{'top':$(window).scrollTop()+'px','marginLeft':'','marginTop':'','left':''})}}$('body').prepend(imgLoading+"<div id='jOverlay' />"+"<div id='jOverlayContent' style='position:"+position+"; z-index:"+(options.zIndex+5)+"; display:none;'/>");$('#jOverlayContent').data('options',options);$('#jOverlayLoading').load(function(){center(this)});if(isIE6){$('select').hide();$('#jOverlayContent select').show()}$('#jOverlay').css({'backgroundColor':options.color,'position':position,'top':'0px','left':'0px','filter':'alpha(opacity='+(options.opacity*100)+')','opacity':options.opacity,'-khtml-opacity':options.opacity,'-moz-opacity':options.opacity,'zIndex':options.zIndex,'width':!isIE6?'100%':$(window).width()+'px','height':!isIE6?'100%':$(document).height()+'px'}).show();if($.trim(options.html)){$(element).html(options.html)}if(this.is('*')){$('#jOverlayContent').data('jOverlayElementPrev',this.prev());$('#jOverlayContent').html(this.show().data('display',options.autoHide?'none':this.css('display')));if(!isImage){center('#jOverlayContent');$('#jOverlayContent').show();if(!options.url&&$.isFunction(onSuccess)){onSuccess(this)}}}if(isImage){$('<img/>').load(function(){var resize=$.resize(this.width,this.height);$(this).css({width:resize.width,height:resize.height});$(element).html(this);center('#jOverlayContent');center('#jOverlayLoading');$('#jOverlayLoading').fadeOut(500);$('#jOverlayContent').show();if($.isFunction(onSuccess)){onSuccess($(element))}}).error(function(){alert('Image ('+options.url+') not found.');$.closeOverlay()}).attr({'src':options.url,'alt':options.url})}if(options.url&&!isImage){$.ajax({type:options.method,data:options.data,url:options.url,success:function(responseText){$('#jOverlayLoading').fadeOut(500);$(element).html(responseText).show();center('#jOverlayContent');if($.isFunction(onSuccess)){onSuccess(responseText)}},error:function(){alert('URL ('+options.url+') not found.');$.closeOverlay()}})}if(isIE6){$(window).scroll(function(){center('#jOverlayContent')});$(window).resize(function(){$('#jOverlay').css({'width':$(window).width()+'px','height':$(document).height()+'px'});center('#jOverlayContent')})}if(options.closeOnEsc){$(document).keydown(function(event){if(event.keyCode==27){$.closeOverlay()}})}else{$(document).unbind('keydown')}if(options.bgClickToClose){$('#jOverlay').click($.closeOverlay)}if(options.timeout&&Number(options.timeout)>0){JOVERLAY_TIMER=window.setTimeout($.closeOverlay,Number(options.timeout))}$('#jOverlayContent').css(options.css||{})};$.resize=function(imageWidth,imageHeight){var x=$(window).width()-150;var y=$(window).height()-150;if(imageWidth>x){imageHeight=imageHeight*(x/imageWidth);imageWidth=x;if(imageHeight>y){imageWidth=imageWidth*(y/imageHeight);imageHeight=y}}else if(imageHeight>y){imageWidth=imageWidth*(y/imageHeight);imageHeight=y;if(imageWidth>x){imageHeight=imageHeight*(x/imageWidth);imageWidth=x}}return{'width':imageWidth,'height':imageHeight}};$.center=function(element,css){var element=$(element);var elemWidth=element.width();element.css($.extend({},{'width':elemWidth+'px','marginLeft':'-'+(elemWidth/2)+'px','marginTop':'-'+element.height()/2+'px','height':'auto','top':!isIE6?'50%':$(window).scrollTop()+($(window).height()/2)+'px','left':'50%'},css||{}))};$.fn.jOverlay.options={'method':'GET','data':'','url':'','color':'#000','opacity':'0.6','zIndex':9999,'center':true,'imgLoading':'','bgClickToClose':true,'success':null,'onSuccess':null,'timeout':0,'autoHide':true,'css':{},'html':'','closeOnEsc':true};$.fn.jOverlay.setDefaults=function(options){$.fn.jOverlay.options=$.extend({},$.fn.jOverlay.options,options||{})};$.closeOverlay=function(){var content=$('#jOverlayContent');var options=content.data('options');var elementPrev=content.data('jOverlayElementPrev');if(isIE6){$("select").show()}if(elementPrev){var contentChildren=content.children();elementPrev.after(contentChildren.css('display',contentChildren.data('display')));contentChildren.removeData('display');content.removeData('jOverlayElementPrev')}content.removeData('options');$('#jOverlayLoading, #jOverlayContent, #jOverlay').remove()}})(jQuery);
|
||||
Loading…
Reference in New Issue