|
|
(5 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <html><script type="text/javascript"> | + | <html> |
- | (function(b){function a(d,c){if(d){if(c){return true}}return false}b.fn.lightbox_me=function(c){return this.each(function(){var f=b.extend({},b.fn.lightbox_me.defaults,c),m=b(),l=b(this),n=b('<iframe id="foo" style="z-index: '+(f.zIndex+1)+';border: none; margin: 0; padding: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0; filter: mask();"/>'),h=a(b.browser.msie,b.browser.version<7);if(f.showOverlay){var g=b(".js_lb_overlay:visible");if(g.length>0){m=b('<div class="lb_overlay_clear js_lb_overlay"/>')}else{m=b('<div class="'+f.classPrefix+'_overlay js_lb_overlay"/>')}}if(h){var e=/^https/i.test(window.location.href||"")?"javascript:false":"about:blank";n.attr("src",e);b("body").append(n)}b("body").append(l.hide()).append(m);if(f.showOverlay){i();m.css({position:"absolute",width:"100%",top:0,left:0,right:0,bottom:0,zIndex:(f.zIndex+2),display:"none"});if(!m.hasClass("lb_overlay_clear")){m.css(f.overlayCSS)}}if(f.showOverlay){m.fadeIn(f.overlaySpeed,function(){d();l[f.appearEffect](f.lightboxSpeed,function(){i();d();f.onLoad()})})}else{d();l[f.appearEffect](f.lightboxSpeed,function(){f.onLoad()})}if(f.parentLightbox){f.parentLightbox.fadeOut(200)}b(window).resize(i).resize(d).scroll(d).keyup(k);if(f.closeClick){m.click(function(o){j();o.preventDefault})}l.delegate(f.closeSelector,"click",function(o){j();o.preventDefault()});l.bind("close",j);l.bind("reposition",d);function j(){var o=l[0].style;if(f.destroyOnClose){l.add(m).remove()}else{l.add(m).hide()}if(f.parentLightbox){f.parentLightbox.fadeIn(200)}n.remove();l.undelegate(f.closeSelector,"click");b(window).unbind("reposition",i);b(window).unbind("reposition",d);b(window).unbind("scroll",d);b(document).unbind("keyup",k);if(h){o.removeExpression("top")}f.onClose()}function k(o){if(a(o.keyCode==27||a(o.DOM_VK_ESCAPE==27,o.which==0),f.closeEsc)){j()}}function i(){if(b(window).height()<b(document).height()){m.css({height:b(document).height()+"px"});n.css({height:b(document).height()+"px"})}else{m.css({height:"100%"});if(h){b("html,body").css("height","100%");n.css("height","100%")}}}function d(){var p=l[0].style;l.css({left:"50%",marginLeft:(l.outerWidth()/2)*-1,zIndex:(f.zIndex+3)});if(a((l.height()+80>=b(window).height()),(l.css("position")!="absolute"||h))){var o=b(document).scrollTop()+40;l.css({position:"absolute",top:o+"px",marginTop:0});if(h){p.removeExpression("top")}}else{if(l.height()+80<b(window).height()){if(h){p.position="absolute";if(f.centered){p.setExpression("top",'(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"');p.marginTop=0}else{var q=a(f.modalCSS,f.modalCSS.top)?parseInt(f.modalCSS.top):0;p.setExpression("top","((blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "+q+') + "px"')}}else{if(f.centered){l.css({position:"fixed",top:"50%",marginTop:(l.outerHeight()/2)*-1})}else{l.css({position:"fixed"}).css(f.modalCSS)}}}}}})};b.fn.lightbox_me.defaults={appearEffect:"fadeIn",appearEase:"",overlaySpeed:250,lightboxSpeed:300,closeSelector:".close",closeClick:true,closeEsc:true,destroyOnClose:false,showOverlay:true,parentLightbox:false,onLoad:function(){},onClose:function(){},classPrefix:"lb",zIndex:999,centered:false,modalCSS:{top:"40px"},overlayCSS:{background:"black",opacity:0.3}}})(jQuery);
| + | |
- | </script>
| + | |
| <script type="text/javascript"> | | <script type="text/javascript"> |
| $(function(){ | | $(function(){ |
| $('span.footnote > a').bind('click', function(){ | | $('span.footnote > a').bind('click', function(){ |
| var url = $(this).attr('href'); | | var url = $(this).attr('href'); |
| + | var title = $(this).text(); |
| $('<div>').load(url + ' div#bodyContent', function(data){ | | $('<div>').load(url + ' div#bodyContent', function(data){ |
- | var $box = $('<div>').addClass('footnote-box'); | + | var $box = $('<div>').addClass('footnote-box').append($('<h2>').append(title)); |
| var $footnote = $(data).find('div#contentSub').nextAll('p'); | | var $footnote = $(data).find('div#contentSub').nextAll('p'); |
- | $box.append($footnote); | + | $box.append($('<div>').append($footnote).addClass('footnote-content')); |
| $('body').append($box); | | $('body').append($box); |
| $box.append($('<span>').addClass('close').addClass('close-btn-32')).lightbox_me({ | | $box.append($('<span>').addClass('close').addClass('close-btn-32')).lightbox_me({ |
- | destroyOnClose : true | + | destroyOnClose : true, |
| + | modalCSS : { 'top' : '100px' } |
| }); | | }); |
| }); | | }); |
Line 18: |
Line 18: |
| }); | | }); |
| }); | | }); |
| + | </script> |
| <style> | | <style> |
- | div.footnote-box {
| |
- | background: rgb(125,126,125);
| |
- | background: -moz-linear-gradient(top, rgba(125,126,125,0.85) 0%, rgba(14,14,14,0.85) 100%);
| |
- | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,0.85)), color-stop(100%,rgba(14,14,14,0.85)));
| |
- | background: -webkit-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%);
| |
- | background: -o-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%);
| |
- | background: -ms-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%);
| |
- | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 );
| |
- | background: linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%);
| |
- | margin 0 auto;
| |
- | border: 3px solid #dfdfdf;
| |
- | border-radius: 10px;
| |
- | -moz-border-radius: 10px;
| |
- | -webkit-border-radius: 10px;
| |
- | display: block;
| |
- | padding: 50px 20px;
| |
- | width: 40%;
| |
- | height: 40%;
| |
- | overflow: auto;
| |
- | }
| |
| .close-btn-32 { | | .close-btn-32 { |
| display: block; | | display: block; |
Line 75: |
Line 56: |
| line-height: 32px; | | line-height: 32px; |
| font-family: "Helvetica Neue", Consolas, Verdana, Tahoma, Calibri, Helvetica, Menlo, "Droid Sans", sans-serif; | | font-family: "Helvetica Neue", Consolas, Verdana, Tahoma, Calibri, Helvetica, Menlo, "Droid Sans", sans-serif; |
| + | } |
| + | div.footnote-box { |
| + | background: rgb(125,126,125); |
| + | background: -moz-linear-gradient(top, rgba(125,126,125,0.85) 0%, rgba(14,14,14,0.85) 100%); |
| + | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,0.85)), color-stop(100%,rgba(14,14,14,0.85))); |
| + | background: -webkit-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); |
| + | background: -o-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); |
| + | background: -ms-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); |
| + | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); |
| + | background: linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); |
| + | margin 0 auto; |
| + | border: 3px solid #dfdfdf; |
| + | border-radius: 10px; |
| + | -moz-border-radius: 10px; |
| + | -webkit-border-radius: 10px; |
| + | display: block; |
| + | padding: 20px 20px; |
| + | width: 60%; |
| + | min-width: 650px; |
| + | height: auto; |
| + | max-height: 60%; |
| + | overflow: auto; |
| + | box-shadow: 3px 3px 5px #333; |
| + | -moz-box-shadow: 3px 3px 5px #333; |
| + | -webkit-box-shadow: 3px 3px 5px #333; |
| } | | } |
| .footnote-box div.footnote-content { | | .footnote-box div.footnote-content { |
| color: #fefefe; | | color: #fefefe; |
| font-size: large !important; | | font-size: large !important; |
- | margin: auto auto; | + | margin: 0px auto 10px; |
| width: 80%; | | width: 80%; |
- | height: 80%; | + | height: 100%; |
| + | } |
| + | .footnote-box h2 { |
| + | color: #fefefe; |
| + | height : 80%; |
| + | margin-bottom: 10px; |
| + | border-bottom-width: 5px; |
| + | padding-left: 8px; |
| + | padding-bottom: 3px; |
| + | font-size: 250%; |
| + | text-align: center; |
| } | | } |
| </style> | | </style> |
- |
| |
| </html> | | </html> |