| 1 |
/* |
| 2 |
* jQuery Reveal Plugin 1.0 |
| 3 |
* www.ZURB.com |
| 4 |
* Copyright 2010, ZURB |
| 5 |
* Free to use under the MIT license. |
| 6 |
* http://www.opensource.org/licenses/mit-license.php |
| 7 |
*/ |
| 8 |
|
| 9 |
|
| 10 |
(function($) { |
| 11 |
|
| 12 |
/*--------------------------- |
| 13 |
Defaults for Reveal |
| 14 |
----------------------------*/ |
| 15 |
|
| 16 |
/*--------------------------- |
| 17 |
Listener for data-reveal-id attributes |
| 18 |
----------------------------*/ |
| 19 |
|
| 20 |
$('a[data-reveal-id]').on('click', function(e) { |
| 21 |
e.preventDefault(); |
| 22 |
var modalLocation = $(this).attr('data-reveal-id'); |
| 23 |
$('#'+modalLocation).reveal($(this).data()); |
| 24 |
}); |
| 25 |
|
| 26 |
/*--------------------------- |
| 27 |
Extend and Execute |
| 28 |
----------------------------*/ |
| 29 |
|
| 30 |
$.fn.reveal = function(options) { |
| 31 |
|
| 32 |
|
| 33 |
var defaults = { |
| 34 |
animation: 'fadeAndPop', //fade, fadeAndPop, none |
| 35 |
animationspeed: 300, //how fast animtions are |
| 36 |
closeonbackgroundclick: true, //if you click background will modal close? |
| 37 |
dismissmodalclass: 'close-reveal-modal' //the class of a button or element that will close an open modal |
| 38 |
}; |
| 39 |
|
| 40 |
//Extend dem' options |
| 41 |
var options = $.extend({}, defaults, options); |
| 42 |
|
| 43 |
return this.each(function() { |
| 44 |
|
| 45 |
/*--------------------------- |
| 46 |
Global Variables |
| 47 |
----------------------------*/ |
| 48 |
var modal = $(this), |
| 49 |
topMeasure = parseInt(modal.css('top')), |
| 50 |
topOffset = modal.height() + topMeasure, |
| 51 |
locked = false, |
| 52 |
modalBG = $('.reveal-modal-bg'); |
| 53 |
|
| 54 |
/*--------------------------- |
| 55 |
Create Modal BG |
| 56 |
----------------------------*/ |
| 57 |
if(modalBG.length == 0) { |
| 58 |
modalBG = $('<div class="reveal-modal-bg" />').insertAfter(modal); |
| 59 |
} |
| 60 |
|
| 61 |
/*--------------------------- |
| 62 |
Open & Close Animations |
| 63 |
----------------------------*/ |
| 64 |
//Entrance Animations |
| 65 |
modal.bind('reveal:open', function () { |
| 66 |
modalBG.unbind('click.modalEvent'); |
| 67 |
$('.' + options.dismissmodalclass).unbind('click.modalEvent'); |
| 68 |
if(!locked) { |
| 69 |
lockModal(); |
| 70 |
if(options.animation == "fadeAndPop") { |
| 71 |
modal.css({'top': $(document).scrollTop()-topOffset, 'opacity' : 0, 'visibility' : 'visible'}); |
| 72 |
modalBG.fadeIn(options.animationspeed/2); |
| 73 |
modal.delay(options.animationspeed/2).animate({ |
| 74 |
"top": $(document).scrollTop()+topMeasure + 'px', |
| 75 |
"opacity" : 1 |
| 76 |
}, options.animationspeed,unlockModal()); |
| 77 |
} |
| 78 |
if(options.animation == "fade") { |
| 79 |
modal.css({'opacity' : 0, 'visibility' : 'visible', 'top': $(document).scrollTop()+topMeasure}); |
| 80 |
modalBG.fadeIn(options.animationspeed/2); |
| 81 |
modal.delay(options.animationspeed/2).animate({ |
| 82 |
"opacity" : 1 |
| 83 |
}, options.animationspeed,unlockModal()); |
| 84 |
} |
| 85 |
if(options.animation == "none") { |
| 86 |
modal.css({'visibility' : 'visible', 'top':$(document).scrollTop()+topMeasure}); |
| 87 |
modalBG.css({"display":"block"}); |
| 88 |
unlockModal() |
| 89 |
} |
| 90 |
} |
| 91 |
modal.unbind('reveal:open'); |
| 92 |
}); |
| 93 |
|
| 94 |
//Closing Animation |
| 95 |
modal.bind('reveal:close', function () { |
| 96 |
if(!locked) { |
| 97 |
lockModal(); |
| 98 |
if(options.animation == "fadeAndPop") { |
| 99 |
modalBG.delay(options.animationspeed).fadeOut(options.animationspeed); |
| 100 |
modal.animate({ |
| 101 |
"top": $(document).scrollTop()-topOffset + 'px', |
| 102 |
"opacity" : 0 |
| 103 |
}, options.animationspeed/2, function() { |
| 104 |
modal.css({'top':topMeasure, 'opacity' : 1, 'visibility' : 'hidden'}); |
| 105 |
unlockModal(); |
| 106 |
}); |
| 107 |
} |
| 108 |
if(options.animation == "fade") { |
| 109 |
modalBG.delay(options.animationspeed).fadeOut(options.animationspeed); |
| 110 |
modal.animate({ |
| 111 |
"opacity" : 0 |
| 112 |
}, options.animationspeed, function() { |
| 113 |
modal.css({'opacity' : 1, 'visibility' : 'hidden', 'top' : topMeasure}); |
| 114 |
unlockModal(); |
| 115 |
}); |
| 116 |
} |
| 117 |
if(options.animation == "none") { |
| 118 |
modal.css({'visibility' : 'hidden', 'top' : topMeasure}); |
| 119 |
modalBG.css({'display' : 'none'}); |
| 120 |
} |
| 121 |
} |
| 122 |
modal.unbind('reveal:close'); |
| 123 |
}); |
| 124 |
|
| 125 |
/*--------------------------- |
| 126 |
Open and add Closing Listeners |
| 127 |
----------------------------*/ |
| 128 |
//Open Modal Immediately |
| 129 |
modal.trigger('reveal:open') |
| 130 |
|
| 131 |
//Close Modal Listeners |
| 132 |
var closeButton = $('.' + options.dismissmodalclass).bind('click.modalEvent', function () { |
| 133 |
modal.trigger('reveal:close') |
| 134 |
}); |
| 135 |
|
| 136 |
if(options.closeonbackgroundclick) { |
| 137 |
modalBG.css({"cursor":"pointer"}) |
| 138 |
modalBG.bind('click.modalEvent', function () { |
| 139 |
modal.trigger('reveal:close') |
| 140 |
}); |
| 141 |
} |
| 142 |
$('body').keyup(function(e) { |
| 143 |
if(e.which===27){ modal.trigger('reveal:close'); } // 27 is the keycode for the Escape key |
| 144 |
}); |
| 145 |
|
| 146 |
|
| 147 |
/*--------------------------- |
| 148 |
Animations Locks |
| 149 |
----------------------------*/ |
| 150 |
function unlockModal() { |
| 151 |
locked = false; |
| 152 |
} |
| 153 |
function lockModal() { |
| 154 |
locked = true; |
| 155 |
} |
| 156 |
|
| 157 |
});//each call |
| 158 |
}//orbit plugin call |
| 159 |
})(jQuery); |
| 160 |
|
| 161 |
|
