|
|
(118 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <html lang="en" class="no-js">
| + | {{:Team:UCLA/Template}} |
- | <head>
| + | |
- | <meta charset="UTF-8" />
| + | |
- | <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
| + | |
- | <meta name="viewport" content="width=device-width, initial-scale=1.0">
| + | |
- | <title>UCLA iGEM </title>
| + | |
- | <meta name="description" content="Blueprint: Fixed Background Scrolling Layout" />
| + | |
- | <meta name="keywords" content="background scrolling, fixed background, background-attachment, jquery" />
| + | |
- | <meta name="author" content="Codrops" />
| + | |
- | <style type="text/css">
| + | |
- | @import url(http://fonts.googleapis.com/css?family=Raleway);
| + | |
- | /* Set all parents to full height */
| + | |
- | html, body,
| + | |
- | .container,
| + | |
- | .cbp-fbscroller,
| + | |
- | .cbp-fbscroller section {
| + | |
- | height: 100%;
| + | |
- | } | + | |
| | | |
- | /* The nav is fixed on the right side and we center it by translating it 50%
| + | <html><br><head> |
- | (we don't know it's height so we can't use the negative margin trick) */
| + | |
- | .cbp-fbscroller > nav {
| + | |
- | position: fixed;
| + | |
- | z-index: 9999;
| + | |
- | right: 100px;
| + | |
- | top: 50%;
| + | |
- | width: 26px;
| + | |
- | -webkit-transform: translateY(-50%);
| + | |
- | -moz-transform: translateY(-50%);
| + | |
- | -ms-transform: translateY(-50%);
| + | |
- | transform: translateY(-50%);
| + | |
- | }
| + | |
| | | |
- | .cbp-fbscroller > nav a {
| + | <title>UCLA iGEM </title> |
- | display: block;
| + | <style> |
- | position: relative;
| + | #slide { |
- | z-index: 9999;
| + | background: url("https://static.igem.org/mediawiki/2013/c/ce/Ucla_bg1.png") 50% 0 no-repeat fixed; |
- | color: transparent;
| + | height: 650px; |
- | width: 26px;
| + | margin: 0 auto; |
- | height: 26px; | + | width: 100%; |
- | outline: none; | + | max-width: 1920px; |
- | margin: 25px 0;
| + | position: relative; |
- | border-radius: 50%;
| + | |
- | border: 4px solid #fff;
| + | |
| } | | } |
- | | + | #slide2 { |
- | .no-touch .cbp-fbscroller > nav a:hover { | + | background: url("https://static.igem.org/mediawiki/2013/f/f9/Ucla_bg2.png") 50% 0 no-repeat fixed; |
- | background: rgba(255,255,255,0.6); | + | height: 650px; |
| + | margin: 0 auto; |
| + | width: 100%; |
| + | max-width: 1920px; |
| + | position: relative; |
| } | | } |
- | | + | #slide3 { |
- | .cbp-fbscroller > nav a.cbp-fbcurrent { | + | background: url("https://static.igem.org/mediawiki/2013/c/ce/Ucla_bg1.png") 50% 0 no-repeat fixed; |
- | background: #fff; | + | height: 700px; |
| + | margin: 0 auto; |
| + | width: 100%; |
| + | max-width: 1920px; |
| + | position: relative; |
| } | | } |
- | | + | #slide article { |
- | /* background-attachment does the trick */
| + | height: 458px; |
- | .cbp-fbscroller section {
| + | position: absolute; |
- | position: relative;
| + | text-align: center; |
- | background-position: top center;
| + | width: 100%; |
- | background-repeat: no-repeat;
| + | font-size: 5em; |
- | background-size: cover;
| + | color: #fff; |
| } | | } |
- | | + | #abs { |
- | .no-touch .cbp-fbscroller section {
| + | font-size: 13px; font-family: "Trebuchet MS", sans-serif; color: #fff; |
- | background-attachment: fixed;
| + | text-align: left center; line-height: 180%; margin: 10px 0px auto 10px |
| } | | } |
- | | + | #abs-title { |
- | #fbsection1 { | + | font-size: 25px; font-family: "Trebuchet MS", sans-serif; color: #fff; |
- | background-image: url(https://static.igem.org/mediawiki/2013/c/ce/Ucla_bg1.png);
| + | text-align: center; line-height: 180%; margin: 10px 5px auto 40px |
| } | | } |
- | | + | #text { |
- | #infb1 { | + | font-family: "Raleway", serif; |
- | font-family: 'Raleway', sans-serif; | + | z-index:100; |
- | position: relative;
| + | position:absolute; |
- | height: 600px;
| + | color:white; |
- | width: 800px;
| + | font-size:20px; |
- | margin: 18px auto 0;
| + | left:145px; |
| + | top:350px; |
| } | | } |
- | | + | #text2 { |
- | #fbsection2 { | + | font-family: "Raleway", serif; |
- | background-image: url(https://static.igem.org/mediawiki/2013/f/f9/Ucla_bg2.png);
| + | z-index:100; |
| + | position:absolute; |
| + | color:black; |
| + | font-size:20px; |
| + | left:675px; |
| + | top:400px; |
| } | | } |
- | | + | #text3 { |
- | #fbsection3 { | + | font-family: "Raleway", serif; |
- | background-image: url(../images/3.jpg);
| + | z-index:100; |
| + | position:absolute; |
| + | color:black; |
| + | font-size:20px; |
| + | left:125px; |
| + | top:525px; |
| } | | } |
| + | #content { |
| + | background: none; |
| + | box-shadow: 0px 0px 0px 0px; |
| | | |
- | #fbsection4 {
| + | </style> |
- | background-image: url(../images/4.jpg); | + | </head> |
- | }
| + | <body> |
| | | |
- | #fbsection5 {
| + | <section id="slide" data-type="background" data-speed="5"> |
- | background-image: url(../images/5.jpg);
| + | <img src="https://static.igem.org/mediawiki/2013/e/ea/Grad.png" width="960"> |
- | }
| + | <p id="text"><a href="#slide2"><font color="white">How it Works</font></a><br> |
| + | <a href="#slide2"><img src="https://static.igem.org/mediawiki/2013/6/62/Downarrow.png" href="#slide2" width="50"></a></p> |
| + | <a name="slide1"></a></section> |
| | | |
- | /* General Blueprint Style */
| + | <section id="slide2" data-type="background" data-speed="5"> |
- | @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
| + | <img src="https://static.igem.org/mediawiki/2013/e/e6/Grad2.png" width="960"> |
- | @font-face {
| + | <p id="text2"><a href="#slide3"><font color="Black">mRNA Display</font></a><br> |
- | font-family: 'fontawesome';
| + | <a href="#slide3"><img src="https://static.igem.org/mediawiki/2013/1/11/Down_arrow_black.png"Width="50"> |
- | src:url('../fonts/fontawesome.eot');
| + | </a></p> |
- | src:url('../fonts/fontawesome.eot?#iefix') format('embedded-opentype'),
| + | <a name="slide2"></a> |
- | url('../fonts/fontawesome.svg#fontawesome') format('svg'),
| + | </section> |
- | url('../fonts/fontawesome.woff') format('woff'),
| + | |
- | url('../fonts/fontawesome.ttf') format('truetype');
| + | |
- | font-weight: normal;
| + | |
- | font-style: normal;
| + | |
- | }
| + | |
- | | + | |
- | *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
| + | |
- | body, html { font-size: 100%; padding: 0; margin: 0;}
| + | |
- | | + | |
- | /* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
| + | |
- | .clearfix:before, .clearfix:after { content: " "; display: table; }
| + | |
- | .clearfix:after { clear: both; }
| + | |
- | | + | |
- | body {
| + | |
- | font-family: 'Lato', Calibri, Arial, sans-serif;
| + | |
- | color: #fff;
| + | |
- | }
| + | |
- | | + | |
- | a {
| + | |
- | color: #f0f0f0;
| + | |
- | text-decoration: none;
| + | |
- | }
| + | |
- | | + | |
- | a:hover {
| + | |
- | color: #000;
| + | |
- | }
| + | |
- | | + | |
- | .container > header {
| + | |
- | padding: 2.875em 1.875em 1.875em;
| + | |
- | position: fixed;
| + | |
- | z-index: 1000;
| + | |
- | width: 60%;
| + | |
- | left: 20%;
| + | |
- | }
| + | |
- | | + | |
- | .container > header h1 {
| + | |
- | font-size: 2.125em;
| + | |
- | line-height: 1.3;
| + | |
- | margin: 0;
| + | |
- | float: left;
| + | |
- | font-weight: 400;
| + | |
- | }
| + | |
- | | + | |
- | .container > header span {
| + | |
- | display: block;
| + | |
- | font-weight: 700;
| + | |
- | text-transform: uppercase;
| + | |
- | letter-spacing: 0.5em;
| + | |
- | padding: 0 0 0.6em 0.1em;
| + | |
- | }
| + | |
- | | + | |
- | .container > header nav {
| + | |
- | float: right;
| + | |
- | }
| + | |
- | | + | |
- | .container > header nav a {
| + | |
- | display: block;
| + | |
- | float: left;
| + | |
- | position: relative;
| + | |
- | width: 2.5em;
| + | |
- | height: 2.5em;
| + | |
- | background: #fff;
| + | |
- | border-radius: 50%;
| + | |
- | color: transparent;
| + | |
- | margin: 0 0.1em;
| + | |
- | border: 4px solid #fff;
| + | |
- | text-indent: -8000px;
| + | |
- | }
| + | |
- | | + | |
- | .container > header nav a:after {
| + | |
- | content: attr(data-info);
| + | |
- | color: #fff;
| + | |
- | position: absolute;
| + | |
- | width: 600%;
| + | |
- | top: 120%;
| + | |
- | text-align: right;
| + | |
- | right: 0;
| + | |
- | opacity: 0;
| + | |
- | pointer-events: none;
| + | |
- | }
| + | |
- | | + | |
- | .container > header nav a:hover:after {
| + | |
- | opacity: 1;
| + | |
- | }
| + | |
- | | + | |
- | .container > header nav a:hover {
| + | |
- | background: #47a3da;
| + | |
- | }
| + | |
- | | + | |
- | .icon-drop:before,
| + | |
- | .icon-arrow-left:before {
| + | |
- | font-family: 'fontawesome';
| + | |
- | position: absolute;
| + | |
- | top: 0;
| + | |
- | width: 100%;
| + | |
- | height: 100%;
| + | |
- | speak: none;
| + | |
- | font-style: normal;
| + | |
- | font-weight: normal;
| + | |
- | line-height: 2;
| + | |
- | text-align: center;
| + | |
- | color: #47a3da;
| + | |
- | -webkit-font-smoothing: antialiased;
| + | |
- | text-indent: 8000px;
| + | |
- | padding-left: 8px;
| + | |
- | }
| + | |
- | | + | |
- | .container > header nav a:hover:before {
| + | |
- | color: #fff;
| + | |
- | }
| + | |
- | | + | |
- | .icon-drop:before {
| + | |
- | content: "\e000";
| + | |
- | }
| + | |
- | | + | |
- | .icon-arrow-left:before {
| + | |
- | content: "\f060";
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | </style><script src="https://2013.igem.org/Team:UCLA/javascript/modernizr.custom.js">
| + | |
- | </script>
| + | |
- | </head>
| + | |
- | <body>
| + | |
- | <div class="container">
| + | |
- |
| + | |
- | <div id="cbp-fbscroller" class="cbp-fbscroller">
| + | |
- | <nav>
| + | |
- | <a href="#fbsection1" class="cbp-fbcurrent">Section 1</a>
| + | |
- | <a href="#fbsection2">Section 2</a>
| + | |
- | <a href="#fbsection3">Section 3</a>
| + | |
- | <a href="#fbsection4">Section 4</a>
| + | |
- | <a href="#fbsection5">Section 5</a>
| + | |
- | </nav>
| + | |
- | <section id="fbsection1"><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></section>
| + | |
- | <section id="fbsection2"><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></section>
| + | |
- | <section id="fbsection3"></section>
| + | |
- | <section id="fbsection4"></section>
| + | |
- | <section id="fbsection5"></section>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
| + | |
- | <!-- jquery.easing by http://gsgd.co.uk/ : http://gsgd.co.uk/sandbox/jquery/easing/ -->
| + | |
- | <script type="text/javascript">
| + | |
- | jQuery.easing.jswing=jQuery.easing.swing;jQuery.extend(jQuery.easing,{def:"easeOutQuad",swing:function(e,f,a,h,g){return jQuery.easing[jQuery.easing.def](e,f,a,h,g)},easeInQuad:function(e,f,a,h,g){return h*(f/=g)*f+a},easeOutQuad:function(e,f,a,h,g){return -h*(f/=g)*(f-2)+a},easeInOutQuad:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f+a}return -h/2*((--f)*(f-2)-1)+a},easeInCubic:function(e,f,a,h,g){return h*(f/=g)*f*f+a},easeOutCubic:function(e,f,a,h,g){return h*((f=f/g-1)*f*f+1)+a},easeInOutCubic:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f+a}return h/2*((f-=2)*f*f+2)+a},easeInQuart:function(e,f,a,h,g){return h*(f/=g)*f*f*f+a},easeOutQuart:function(e,f,a,h,g){return -h*((f=f/g-1)*f*f*f-1)+a},easeInOutQuart:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f+a}return -h/2*((f-=2)*f*f*f-2)+a},easeInQuint:function(e,f,a,h,g){return h*(f/=g)*f*f*f*f+a},easeOutQuint:function(e,f,a,h,g){return h*((f=f/g-1)*f*f*f*f+1)+a},easeInOutQuint:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f*f+a}return h/2*((f-=2)*f*f*f*f+2)+a},easeInSine:function(e,f,a,h,g){return -h*Math.cos(f/g*(Math.PI/2))+h+a},easeOutSine:function(e,f,a,h,g){return h*Math.sin(f/g*(Math.PI/2))+a},easeInOutSine:function(e,f,a,h,g){return -h/2*(Math.cos(Math.PI*f/g)-1)+a},easeInExpo:function(e,f,a,h,g){return(f==0)?a:h*Math.pow(2,10*(f/g-1))+a},easeOutExpo:function(e,f,a,h,g){return(f==g)?a+h:h*(-Math.pow(2,-10*f/g)+1)+a},easeInOutExpo:function(e,f,a,h,g){if(f==0){return a}if(f==g){return a+h}if((f/=g/2)<1){return h/2*Math.pow(2,10*(f-1))+a}return h/2*(-Math.pow(2,-10*--f)+2)+a},easeInCirc:function(e,f,a,h,g){return -h*(Math.sqrt(1-(f/=g)*f)-1)+a},easeOutCirc:function(e,f,a,h,g){return h*Math.sqrt(1-(f=f/g-1)*f)+a},easeInOutCirc:function(e,f,a,h,g){if((f/=g/2)<1){return -h/2*(Math.sqrt(1-f*f)-1)+a}return h/2*(Math.sqrt(1-(f-=2)*f)+1)+a},easeInElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return -(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e},easeOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return g*Math.pow(2,-10*h)*Math.sin((h*k-i)*(2*Math.PI)/j)+l+e},easeInOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k/2)==2){return e+l}if(!j){j=k*(0.3*1.5)}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}if(h<1){return -0.5*(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e}return g*Math.pow(2,-10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j)*0.5+l+e},easeInBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*(f/=h)*f*((g+1)*f-g)+a},easeOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*((f=f/h-1)*f*((g+1)*f+g)+1)+a},easeInOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}if((f/=h/2)<1){return i/2*(f*f*(((g*=(1.525))+1)*f-g))+a}return i/2*((f-=2)*f*(((g*=(1.525))+1)*f+g)+2)+a},easeInBounce:function(e,f,a,h,g){return h-jQuery.easing.easeOutBounce(e,g-f,0,h,g)+a},easeOutBounce:function(e,f,a,h,g){if((f/=g)<(1/2.75)){return h*(7.5625*f*f)+a}else{if(f<(2/2.75)){return h*(7.5625*(f-=(1.5/2.75))*f+0.75)+a}else{if(f<(2.5/2.75)){return h*(7.5625*(f-=(2.25/2.75))*f+0.9375)+a}else{return h*(7.5625*(f-=(2.625/2.75))*f+0.984375)+a}}}},easeInOutBounce:function(e,f,a,h,g){if(f<g/2){return jQuery.easing.easeInBounce(e,f*2,0,h,g)*0.5+a}return jQuery.easing.easeOutBounce(e,f*2-g,0,h,g)*0.5+h*0.5+a}});
| + | |
- |
| + | |
- | (function(){var t=[].indexOf||function(t){for(var e=0,n=this.length;e<n;e++){if(e in this&&this[e]===t)return e}return-1},e=[].slice;(function(t,e){if(typeof define==="function"&&define.amd){return define("waypoints",["jquery"],function(n){return e(n,t)})}else{return e(t.jQuery,t)}})(this,function(n,r){var i,o,l,s,f,u,a,c,h,d,p,y,v,w,g,m;i=n(r);c=t.call(r,"ontouchstart")>=0;s={horizontal:{},vertical:{}};f=1;a={};u="waypoints-context-id";p="resize.waypoints";y="scroll.waypoints";v=1;w="waypoints-waypoint-ids";g="waypoint";m="waypoints";o=function(){function t(t){var e=this;this.$element=t;this.element=t[0];this.didResize=false;this.didScroll=false;this.id="context"+f++;this.oldScroll={x:t.scrollLeft(),y:t.scrollTop()};this.waypoints={horizontal:{},vertical:{}};t.data(u,this.id);a[this.id]=this;t.bind(y,function(){var t;if(!(e.didScroll||c)){e.didScroll=true;t=function(){e.doScroll();return e.didScroll=false};return r.setTimeout(t,n[m].settings.scrollThrottle)}});t.bind(p,function(){var t;if(!e.didResize){e.didResize=true;t=function(){n[m]("refresh");return e.didResize=false};return r.setTimeout(t,n[m].settings.resizeThrottle)}})}t.prototype.doScroll=function(){var t,e=this;t={horizontal:{newScroll:this.$element.scrollLeft(),oldScroll:this.oldScroll.x,forward:"right",backward:"left"},vertical:{newScroll:this.$element.scrollTop(),oldScroll:this.oldScroll.y,forward:"down",backward:"up"}};if(c&&(!t.vertical.oldScroll||!t.vertical.newScroll)){n[m]("refresh")}n.each(t,function(t,r){var i,o,l;l=[];o=r.newScroll>r.oldScroll;i=o?r.forward:r.backward;n.each(e.waypoints[t],function(t,e){var n,i;if(r.oldScroll<(n=e.offset)&&n<=r.newScroll){return l.push(e)}else if(r.newScroll<(i=e.offset)&&i<=r.oldScroll){return l.push(e)}});l.sort(function(t,e){return t.offset-e.offset});if(!o){l.reverse()}return n.each(l,function(t,e){if(e.options.continuous||t===l.length-1){return e.trigger([i])}})});return this.oldScroll={x:t.horizontal.newScroll,y:t.vertical.newScroll}};t.prototype.refresh=function(){var t,e,r,i=this;r=n.isWindow(this.element);e=this.$element.offset();this.doScroll();t={horizontal:{contextOffset:r?0:e.left,contextScroll:r?0:this.oldScroll.x,contextDimension:this.$element.width(),oldScroll:this.oldScroll.x,forward:"right",backward:"left",offsetProp:"left"},vertical:{contextOffset:r?0:e.top,contextScroll:r?0:this.oldScroll.y,contextDimension:r?n[m]("viewportHeight"):this.$element.height(),oldScroll:this.oldScroll.y,forward:"down",backward:"up",offsetProp:"top"}};return n.each(t,function(t,e){return n.each(i.waypoints[t],function(t,r){var i,o,l,s,f;i=r.options.offset;l=r.offset;o=n.isWindow(r.element)?0:r.$element.offset()[e.offsetProp];if(n.isFunction(i)){i=i.apply(r.element)}else if(typeof i==="string"){i=parseFloat(i);if(r.options.offset.indexOf("%")>-1){i=Math.ceil(e.contextDimension*i/100)}}r.offset=o-e.contextOffset+e.contextScroll-i;if(r.options.onlyOnScroll&&l!=null||!r.enabled){return}if(l!==null&&l<(s=e.oldScroll)&&s<=r.offset){return r.trigger([e.backward])}else if(l!==null&&l>(f=e.oldScroll)&&f>=r.offset){return r.trigger([e.forward])}else if(l===null&&e.oldScroll>=r.offset){return r.trigger([e.forward])}})})};t.prototype.checkEmpty=function(){if(n.isEmptyObject(this.waypoints.horizontal)&&n.isEmptyObject(this.waypoints.vertical)){this.$element.unbind([p,y].join(" "));return delete a[this.id]}};return t}();l=function(){function t(t,e,r){var i,o;r=n.extend({},n.fn[g].defaults,r);if(r.offset==="bottom-in-view"){r.offset=function(){var t;t=n[m]("viewportHeight");if(!n.isWindow(e.element)){t=e.$element.height()}return t-n(this).outerHeight()}}this.$element=t;this.element=t[0];this.axis=r.horizontal?"horizontal":"vertical";this.callback=r.handler;this.context=e;this.enabled=r.enabled;this.id="waypoints"+v++;this.offset=null;this.options=r;e.waypoints[this.axis][this.id]=this;s[this.axis][this.id]=this;i=(o=t.data(w))!=null?o:[];i.push(this.id);t.data(w,i)}t.prototype.trigger=function(t){if(!this.enabled){return}if(this.callback!=null){this.callback.apply(this.element,t)}if(this.options.triggerOnce){return this.destroy()}};t.prototype.disable=function(){return this.enabled=false};t.prototype.enable=function(){this.context.refresh();return this.enabled=true};t.prototype.destroy=function(){delete s[this.axis][this.id];delete this.context.waypoints[this.axis][this.id];return this.context.checkEmpty()};t.getWaypointsByElement=function(t){var e,r;r=n(t).data(w);if(!r){return[]}e=n.extend({},s.horizontal,s.vertical);return n.map(r,function(t){return e[t]})};return t}();d={init:function(t,e){var r;if(e==null){e={}}if((r=e.handler)==null){e.handler=t}this.each(function(){var t,r,i,s;t=n(this);i=(s=e.context)!=null?s:n.fn[g].defaults.context;if(!n.isWindow(i)){i=t.closest(i)}i=n(i);r=a[i.data(u)];if(!r){r=new o(i)}return new l(t,r,e)});n[m]("refresh");return this},disable:function(){return d._invoke(this,"disable")},enable:function(){return d._invoke(this,"enable")},destroy:function(){return d._invoke(this,"destroy")},prev:function(t,e){return d._traverse.call(this,t,e,function(t,e,n){if(e>0){return t.push(n[e-1])}})},next:function(t,e){return d._traverse.call(this,t,e,function(t,e,n){if(e<n.length-1){return t.push(n[e+1])}})},_traverse:function(t,e,i){var o,l;if(t==null){t="vertical"}if(e==null){e=r}l=h.aggregate(e);o=[];this.each(function(){var e;e=n.inArray(this,l[t]);return i(o,e,l[t])});return this.pushStack(o)},_invoke:function(t,e){t.each(function(){var t;t=l.getWaypointsByElement(this);return n.each(t,function(t,n){n[e]();return true})});return this}};n.fn[g]=function(){var t,r;r=arguments[0],t=2<=arguments.length?e.call(arguments,1):[];if(d[r]){return d[r].apply(this,t)}else if(n.isFunction(r)){return d.init.apply(this,arguments)}else if(n.isPlainObject(r)){return d.init.apply(this,[null,r])}else if(!r){return n.error("jQuery Waypoints needs a callback function or handler option.")}else{return n.error("The "+r+" method does not exist in jQuery Waypoints.")}};n.fn[g].defaults={context:r,continuous:true,enabled:true,horizontal:false,offset:0,triggerOnce:false};h={refresh:function(){return n.each(a,function(t,e){return e.refresh()})},viewportHeight:function(){var t;return(t=r.innerHeight)!=null?t:i.height()},aggregate:function(t){var e,r,i;e=s;if(t){e=(i=a[n(t).data(u)])!=null?i.waypoints:void 0}if(!e){return[]}r={horizontal:[],vertical:[]};n.each(r,function(t,i){n.each(e[t],function(t,e){return i.push(e)});i.sort(function(t,e){return t.offset-e.offset});r[t]=n.map(i,function(t){return t.element});return r[t]=n.unique(r[t])});return r},above:function(t){if(t==null){t=r}return h._filter(t,"vertical",function(t,e){return e.offset<=t.oldScroll.y})},below:function(t){if(t==null){t=r}return h._filter(t,"vertical",function(t,e){return e.offset>t.oldScroll.y})},left:function(t){if(t==null){t=r}return h._filter(t,"horizontal",function(t,e){return e.offset<=t.oldScroll.x})},right:function(t){if(t==null){t=r}return h._filter(t,"horizontal",function(t,e){return e.offset>t.oldScroll.x})},enable:function(){return h._invoke("enable")},disable:function(){return h._invoke("disable")},destroy:function(){return h._invoke("destroy")},extendFn:function(t,e){return d[t]=e},_invoke:function(t){var e;e=n.extend({},s.vertical,s.horizontal);return n.each(e,function(e,n){n[t]();return true})},_filter:function(t,e,r){var i,o;i=a[n(t).data(u)];if(!i){return[]}o=[];n.each(i.waypoints[e],function(t,e){if(r(i,e)){return o.push(e)}});o.sort(function(t,e){return t.offset-e.offset});return n.map(o,function(t){return t.element})}};n[m]=function(){var t,n;n=arguments[0],t=2<=arguments.length?e.call(arguments,1):[];if(h[n]){return h[n].apply(null,t)}else{return h.aggregate.call(null,n)}};n[m].settings={resizeThrottle:100,scrollThrottle:30};return i.load(function(){return n[m]("refresh")})})}).call(this);
| + | |
- |
| + | |
- | (function($) {
| + | |
| | | |
- | var $event = $.event,
| + | <section id="slide3" data-type="background" data-speed="8"> |
- | $special,
| + | <img src="https://static.igem.org/mediawiki/2013/4/4b/Grad3.png" width="960"> |
- | resizeTimeout;
| + | <p id="text3"> |
| + | <a href="#slide1"><img src="https://static.igem.org/mediawiki/2013/c/c2/Uparrow_white.png" href="#slide2" width="50"></a> |
| + | <a href="https://2013.igem.org/Team:UCLA/Project"><img src="https://static.igem.org/mediawiki/2013/3/34/Sideways_arrow_white.png" width="50"></a> |
| + | <br> |
| + | <a href="#slide1"><font color="white">Top</font></a> <a href="https://2013.igem.org/Team:UCLA/Project"><font color="white">More Details!</font></a> |
| | | |
- | $special = $event.special.debouncedresize = {
| + | </p> |
- | setup: function() {
| + | <a name="slide3"></a></section> |
- | $( this ).on( "resize", $special.handler );
| + | |
- | },
| + | |
- | teardown: function() {
| + | |
- | $( this ).off( "resize", $special.handler );
| + | |
- | },
| + | |
- | handler: function( event, execAsap ) {
| + | |
- | // Save the context
| + | |
- | var context = this,
| + | |
- | args = arguments,
| + | |
- | dispatch = function() {
| + | |
- | // set correct event type
| + | |
- | event.type = "debouncedresize";
| + | |
- | $event.dispatch.apply( context, args );
| + | |
- | };
| + | |
| | | |
- | if ( resizeTimeout ) {
| |
- | clearTimeout( resizeTimeout );
| |
- | }
| |
| | | |
- | execAsap ?
| |
- | dispatch() :
| |
- | resizeTimeout = setTimeout( dispatch, $special.threshold );
| |
- | },
| |
- | threshold: 150
| |
- | };
| |
| | | |
- | })(jQuery);
| |
- |
| |
- | var cbpFixedScrollLayout=(function(){var a={$sections:$("#cbp-fbscroller > section"),$navlinks:$("#cbp-fbscroller > nav:first > a"),currentLink:0,$body:$("html, body"),animspeed:650,animeasing:"easeInOutExpo"};function d(){a.$navlinks.on("click",function(){c(a.$sections.eq($(this).index()).offset().top);return false});a.$sections.waypoint(function(e){if(e==="down"){b($(this))}},{offset:"30%"}).waypoint(function(e){if(e==="up"){b($(this))}},{offset:"-30%"});$(window).on("debouncedresize",function(){c(a.$sections.eq(a.currentLink).offset().top)})}function b(e){a.$navlinks.eq(a.currentLink).removeClass("cbp-fbcurrent");a.currentLink=e.index("section");a.$navlinks.eq(a.currentLink).addClass("cbp-fbcurrent")}function c(e){a.$body.stop().animate({scrollTop:e},a.animspeed,a.animeasing)}return{init:d}})();
| |
- | </script>
| |
- | <script>
| |
- | $(function() {
| |
- | cbpFixedScrollLayout.init();
| |
- | });
| |
- | </script>
| |
| </body> | | </body> |
| </html> | | </html> |