|
|
| (28 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| | + | {{:Template:Team:UNAM_Genomics_Mexico/Templates/css/style}} |
| | {{:Template:Team:UNAM_Genomics_Mexico/webhtml| content= | | {{:Template:Team:UNAM_Genomics_Mexico/webhtml| content= |
| - | <html> | + | <br /><br /> |
| - | <head>
| + | |
| - | <style type="text/css">
| + | |
| - | *{
| + | |
| - | margin:0;
| + | |
| - | padding:0;
| + | |
| - | }
| + | |
| - | body{
| + | |
| - | font-family:"Trebuchet MS", "Myriad Pro", Arial, sans-serif;
| + | |
| - | font-size:14px;
| + | |
| - | overflow-x:hidden;
| + | |
| - | }
| + | |
| - | a{
| + | |
| - | color:#555;
| + | |
| - | text-decoration:none;
| + | |
| - | }
| + | |
| - | a:hover{
| + | |
| - | color:#222;
| + | |
| - | }
| + | |
| - | p{
| + | |
| - | padding:5px 0px;
| + | |
| - | }
| + | |
| - | .clear{
| + | |
| - | clear:both;
| + | |
| - | }
| + | |
| - | /* Slider Style */
| + | |
| - | .pxs_container{
| + | |
| - | width:100%;
| + | |
| - | height:840px;
| + | |
| - | position:relative;
| + | |
| - | border-top:7px solid #333;
| + | |
| - | border-bottom:7px solid #333;
| + | |
| - | overflow:hidden;
| + | |
| - | -moz-box-shadow:0px 0px 7px #000;
| + | |
| - | -webkit-box-shadow:0px 0px 7px #000;
| + | |
| - | box-shadow:0px 0px 7px #000;
| + | |
| - | }
| + | |
| - | .pxs_bg{
| + | |
| - | background:transparent url(https://static.igem.org/mediawiki/2012/e/e5/UNAM-Genomics_Mexico_Bg.png) repeat top left;
| + | |
| - | }
| + | |
| - | .pxs_bg div{
| + | |
| - | position:absolute;
| + | |
| - | top:0px;
| + | |
| - | left:0px;
| + | |
| - | width:2000px; /*1264px window width times number of images*/
| + | |
| - | height:840px;
| + | |
| - | background-repeat:repeat;
| + | |
| - | background-position:top left;
| + | |
| - | background-color:transparent;
| + | |
| - | }
| + | |
| - | .pxs_bg .pxs_bg1{
| + | |
| - | background-image:url(https://static.igem.org/mediawiki/2012/e/e6/UNAM-Genomics_Mexico_Bg1.png);
| + | |
| - | /*left negative 1/8 of ww*/
| + | |
| - | }
| + | |
| - | .pxs_bg .pxs_bg2{
| + | |
| - | background-image:url(https://static.igem.org/mediawiki/2012/7/7a/UNAM-Genomics_Mexico_Bg2.png);
| + | |
| - | /*left negative 1/4 of ww*/
| + | |
| - | }
| + | |
| - | .pxs_bg .pxs_bg3{
| + | |
| - | background-image:url(https://static.igem.org/mediawiki/2012/f/fb/UNAM-Genomics_Mexico_Bg3.png);
| + | |
| - | /*left negative 1/2 of ww*/
| + | |
| - | }
| + | |
| - | .pxs_slider_wrapper{
| + | |
| - | display:none;
| + | |
| - | }
| + | |
| - | .pxs_container ul{
| + | |
| - | margin:0px;
| + | |
| - | padding:0px;
| + | |
| - | list-style:none;
| + | |
| - | }
| + | |
| - | ul.pxs_slider{
| + | |
| - | position:absolute;
| + | |
| - | left:0px;
| + | |
| - | top:0px;
| + | |
| - | height:840px;
| + | |
| - | }
| + | |
| - | ul.pxs_slider li{
| + | |
| - | height:840px;
| + | |
| - | float:left;
| + | |
| - | position:relative;
| + | |
| - | }
| + | |
| - | ul.pxs_slider li img{
| + | |
| - | display:block;
| + | |
| - | margin:35px auto 0px auto;
| + | |
| - | -moz-box-shadow:0px 0px 7px #222;
| + | |
| - | -webkit-box-shadow:0px 0px 7px #222;
| + | |
| - | box-shadow:0px 0px 7px #222;
| + | |
| - | border: 8px solid transparent;
| + | |
| - | -moz-border-radius:4px;
| + | |
| - | -webkit-border-radius:4px;
| + | |
| - | border-radius:4px;
| + | |
| - | }
| + | |
| - | ul.pxs_thumbnails{
| + | |
| - | height:35px;
| + | |
| - | position:absolute;
| + | |
| - | top:560px;
| + | |
| - | left:50%;
| + | |
| - | }
| + | |
| - | ul.pxs_thumbnails li{
| + | |
| - | position:absolute;
| + | |
| - | display:block;
| + | |
| - | }
| + | |
| - | ul.pxs_thumbnails li img{
| + | |
| - | border: 5px solid #FFFFFF;
| + | |
| - | -moz-box-shadow:1px 1px 7px #555;
| + | |
| - | -webkit-box-shadow:1px 1px 7px #555;
| + | |
| - | box-shadow:1px 1px 7px #555;
| + | |
| - | cursor:pointer;
| + | |
| - | display:block;
| + | |
| - | opacity:0.7;
| + | |
| - | }
| + | |
| - | ul.pxs_thumbnails li.selected img{
| + | |
| - | opacity:1.0;
| + | |
| - | }
| + | |
| - | .pxs_navigation span{
| + | |
| - | position:absolute;
| + | |
| - | width:30px;
| + | |
| - | height:60px;
| + | |
| - | -moz-box-shadow:0px 0px 2px #000;
| + | |
| - | -webkit-box-shadow:0px 0px 2px #000;
| + | |
| - | box-shadow:0px 0px 2px #000;
| + | |
| - | top:145px;
| + | |
| - | opacity:0.6;
| + | |
| - | -moz-border-radius:4px;
| + | |
| - | -webkit-border-radius:4px;
| + | |
| - | border-radius:4px;
| + | |
| - | cursor:pointer;
| + | |
| - | }
| + | |
| - | .pxs_navigation span:hover{
| + | |
| - | opacity:0.9;
| + | |
| - | }
| + | |
| - | .pxs_navigation span.pxs_prev{
| + | |
| - | background:#000 url(https://static.igem.org/mediawiki/2012/3/3b/UNAM-Genomics_Mexico_Prev.png) no-repeat center center;
| + | |
| - | }
| + | |
| - | .pxs_navigation span.pxs_next{
| + | |
| - | background:#000 url(https://static.igem.org/mediawiki/2012/9/94/UNAM-Genomics_Mexico_Next.png) no-repeat center center;
| + | |
| - | }
| + | |
| - | .pxs_loading{
| + | |
| - | color:#fff;
| + | |
| - | font-size:20px;
| + | |
| - | padding:15px 15px 15px 50px;
| + | |
| - | position:absolute;
| + | |
| - | background:#333 url(https://static.igem.org/mediawiki/2012/d/da/UNAM-Genomics_Mexico_Ajax-loader.gif) no-repeat 10px 50%;
| + | |
| - | -moz-border-radius:15px;
| + | |
| - | -webkit-border-radius:15px;
| + | |
| - | border-radius:15px;
| + | |
| - | opacity:0.7;
| + | |
| - | width:180px;
| + | |
| - | position:absolute;
| + | |
| - | top:150px;
| + | |
| - | left:50%;
| + | |
| - | margin-left:-90px;
| + | |
| - | }
| + | |
| - | </style>
| + | |
| - | <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon"/>
| + | |
| - | <link rel="stylesheet" type="text/css" href="css/style.css" />
| + | |
| - | <script type="text/javascript">
| + | |
| - | /*
| + | |
| - | * Copyright (c) 2009 Simo Kinnunen.
| + | |
| - | * Licensed under the MIT license.
| + | |
| - | *
| + | |
| - | * @version 1.09i
| + | |
| - | */
| + | |
| - | var Cufon=(function(){var m=function(){return m.replace.apply(null,arguments)};var x=m.DOM={ready:(function(){var C=false,E={loaded:1,complete:1};var B=[],D=function(){if(C){return}C=true;for(var F;F=B.shift();F()){}};if(document.addEventListener){document.addEventListener("DOMContentLoaded",D,false);window.addEventListener("pageshow",D,false)}if(!window.opera&&document.readyState){(function(){E[document.readyState]?D():setTimeout(arguments.callee,10)})()}if(document.readyState&&document.createStyleSheet){(function(){try{document.body.doScroll("left");D()}catch(F){setTimeout(arguments.callee,1)}})()}q(window,"load",D);return function(F){if(!arguments.length){D()}else{C?F():B.push(F)}}})(),root:function(){return document.documentElement||document.body}};var n=m.CSS={Size:function(C,B){this.value=parseFloat(C);this.unit=String(C).match(/[a-z%]*$/)[0]||"px";this.convert=function(D){return D/B*this.value};this.convertFrom=function(D){return D/this.value*B};this.toString=function(){return this.value+this.unit}},addClass:function(C,B){var D=C.className;C.className=D+(D&&" ")+B;return C},color:j(function(C){var B={};B.color=C.replace(/^rgba\((.*?),\s*([\d.]+)\)/,function(E,D,F){B.opacity=parseFloat(F);return"rgb("+D+")"});return B}),fontStretch:j(function(B){if(typeof B=="number"){return B}if(/%$/.test(B)){return parseFloat(B)/100}return{"ultra-condensed":0.5,"extra-condensed":0.625,condensed:0.75,"semi-condensed":0.875,"semi-expanded":1.125,expanded:1.25,"extra-expanded":1.5,"ultra-expanded":2}[B]||1}),getStyle:function(C){var B=document.defaultView;if(B&&B.getComputedStyle){return new a(B.getComputedStyle(C,null))}if(C.currentStyle){return new a(C.currentStyle)}return new a(C.style)},gradient:j(function(F){var G={id:F,type:F.match(/^-([a-z]+)-gradient\(/)[1],stops:[]},C=F.substr(F.indexOf("(")).match(/([\d.]+=)?(#[a-f0-9]+|[a-z]+\(.*?\)|[a-z]+)/ig);for(var E=0,B=C.length,D;E<B;++E){D=C[E].split("=",2).reverse();G.stops.push([D[1]||E/(B-1),D[0]])}return G}),quotedList:j(function(E){var D=[],C=/\s*((["'])([\s\S]*?[^\\])\2|[^,]+)\s*/g,B;while(B=C.exec(E)){D.push(B[3]||B[1])}return D}),recognizesMedia:j(function(G){var E=document.createElement("style"),D,C,B;E.type="text/css";E.media=G;try{E.appendChild(document.createTextNode("/**/"))}catch(F){}C=g("head")[0];C.insertBefore(E,C.firstChild);D=(E.sheet||E.styleSheet);B=D&&!D.disabled;C.removeChild(E);return B}),removeClass:function(D,C){var B=RegExp("(?:^|\\s+)"+C+"(?=\\s|$)","g");D.className=D.className.replace(B,"");return D},supports:function(D,C){var B=document.createElement("span").style;if(B[D]===undefined){return false}B[D]=C;return B[D]===C},textAlign:function(E,D,B,C){if(D.get("textAlign")=="right"){if(B>0){E=" "+E}}else{if(B<C-1){E+=" "}}return E},textShadow:j(function(F){if(F=="none"){return null}var E=[],G={},B,C=0;var D=/(#[a-f0-9]+|[a-z]+\(.*?\)|[a-z]+)|(-?[\d.]+[a-z%]*)|,/ig;while(B=D.exec(F)){if(B[0]==","){E.push(G);G={};C=0}else{if(B[1]){G.color=B[1]}else{G[["offX","offY","blur"][C++]]=B[2]}}}E.push(G);return E}),textTransform:(function(){var B={uppercase:function(C){return C.toUpperCase()},lowercase:function(C){return C.toLowerCase()},capitalize:function(C){return C.replace(/\b./g,function(D){return D.toUpperCase()})}};return function(E,D){var C=B[D.get("textTransform")];return C?C(E):E}})(),whiteSpace:(function(){var D={inline:1,"inline-block":1,"run-in":1};var C=/^\s+/,B=/\s+$/;return function(H,F,G,E){if(E){if(E.nodeName.toLowerCase()=="br"){H=H.replace(C,"")}}if(D[F.get("display")]){return H}if(!G.previousSibling){H=H.replace(C,"")}if(!G.nextSibling){H=H.replace(B,"")}return H}})()};n.ready=(function(){var B=!n.recognizesMedia("all"),E=false;var D=[],H=function(){B=true;for(var K;K=D.shift();K()){}};var I=g("link"),J=g("style");function C(K){return K.disabled||G(K.sheet,K.media||"screen")}function G(M,P){if(!n.recognizesMedia(P||"all")){return true}if(!M||M.disabled){return false}try{var Q=M.cssRules,O;if(Q){search:for(var L=0,K=Q.length;O=Q[L],L<K;++L){switch(O.type){case 2:break;case 3:if(!G(O.styleSheet,O.media.mediaText)){return false}break;default:break search}}}}catch(N){}return true}function F(){if(document.createStyleSheet){return true}var L,K;for(K=0;L=I[K];++K){if(L.rel.toLowerCase()=="stylesheet"&&!C(L)){return false}}for(K=0;L=J[K];++K){if(!C(L)){return false}}return true}x.ready(function(){if(!E){E=n.getStyle(document.body).isUsable()}if(B||(E&&F())){H()}else{setTimeout(arguments.callee,10)}});return function(K){if(B){K()}else{D.push(K)}}})();function s(D){var C=this.face=D.face,B={"\u0020":1,"\u00a0":1,"\u3000":1};this.glyphs=D.glyphs;this.w=D.w;this.baseSize=parseInt(C["units-per-em"],10);this.family=C["font-family"].toLowerCase();this.weight=C["font-weight"];this.style=C["font-style"]||"normal";this.viewBox=(function(){var F=C.bbox.split(/\s+/);var E={minX:parseInt(F[0],10),minY:parseInt(F[1],10),maxX:parseInt(F[2],10),maxY:parseInt(F[3],10)};E.width=E.maxX-E.minX;E.height=E.maxY-E.minY;E.toString=function(){return[this.minX,this.minY,this.width,this.height].join(" ")};return E})();this.ascent=-parseInt(C.ascent,10);this.descent=-parseInt(C.descent,10);this.height=-this.ascent+this.descent;this.spacing=function(L,N,E){var O=this.glyphs,M,K,G,P=[],F=0,J=-1,I=-1,H;while(H=L[++J]){M=O[H]||this.missingGlyph;if(!M){continue}if(K){F-=G=K[H]||0;P[I]-=G}F+=P[++I]=~~(M.w||this.w)+N+(B[H]?E:0);K=M.k}P.total=F;return P}}function f(){var C={},B={oblique:"italic",italic:"oblique"};this.add=function(D){(C[D.style]||(C[D.style]={}))[D.weight]=D};this.get=function(H,I){var G=C[H]||C[B[H]]||C.normal||C.italic||C.oblique;if(!G){return null}I={normal:400,bold:700}[I]||parseInt(I,10);if(G[I]){return G[I]}var E={1:1,99:0}[I%100],K=[],F,D;if(E===undefined){E=I>400}if(I==500){I=400}for(var J in G){if(!k(G,J)){continue}J=parseInt(J,10);if(!F||J<F){F=J}if(!D||J>D){D=J}K.push(J)}if(I<F){I=F}if(I>D){I=D}K.sort(function(M,L){return(E?(M>=I&&L>=I)?M<L:M>L:(M<=I&&L<=I)?M>L:M<L)?-1:1});return G[K[0]]}}function r(){function D(F,G){if(F.contains){return F.contains(G)}return F.compareDocumentPosition(G)&16}function B(G){var F=G.relatedTarget;if(!F||D(this,F)){return}C(this,G.type=="mouseover")}function E(F){C(this,F.type=="mouseenter")}function C(F,G){setTimeout(function(){var H=d.get(F).options;m.replace(F,G?h(H,H.hover):H,true)},10)}this.attach=function(F){if(F.onmouseenter===undefined){q(F,"mouseover",B);q(F,"mouseout",B)}else{q(F,"mouseenter",E);q(F,"mouseleave",E)}}}function u(){var C=[],D={};function B(H){var E=[],G;for(var F=0;G=H[F];++F){E[F]=C[D[G]]}return E}this.add=function(F,E){D[F]=C.push(E)-1};this.repeat=function(){var E=arguments.length?B(arguments):C,F;for(var G=0;F=E[G++];){m.replace(F[0],F[1],true)}}}function A(){var D={},B=0;function C(E){return E.cufid||(E.cufid=++B)}this.get=function(E){var F=C(E);return D[F]||(D[F]={})}}function a(B){var D={},C={};this.extend=function(E){for(var F in E){if(k(E,F)){D[F]=E[F]}}return this};this.get=function(E){return D[E]!=undefined?D[E]:B[E]};this.getSize=function(F,E){return C[F]||(C[F]=new n.Size(this.get(F),E))};this.isUsable=function(){return !!B}}function q(C,B,D){if(C.addEventListener){C.addEventListener(B,D,false)}else{if(C.attachEvent){C.attachEvent("on"+B,function(){return D.call(C,window.event)})}}}function v(C,B){var D=d.get(C);if(D.options){return C}if(B.hover&&B.hoverables[C.nodeName.toLowerCase()]){b.attach(C)}D.options=B;return C}function j(B){var C={};return function(D){if(!k(C,D)){C[D]=B.apply(null,arguments)}return C[D]}}function c(F,E){var B=n.quotedList(E.get("fontFamily").toLowerCase()),D;for(var C=0;D=B[C];++C){if(i[D]){return i[D].get(E.get("fontStyle"),E.get("fontWeight"))}}return null}function g(B){return document.getElementsByTagName(B)}function k(C,B){return C.hasOwnProperty(B)}function h(){var C={},B,F;for(var E=0,D=arguments.length;B=arguments[E],E<D;++E){for(F in B){if(k(B,F)){C[F]=B[F]}}}return C}function o(E,M,C,N,F,D){var K=document.createDocumentFragment(),H;if(M===""){return K}var L=N.separate;var I=M.split(p[L]),B=(L=="words");if(B&&t){if(/^\s/.test(M)){I.unshift("")}if(/\s$/.test(M)){I.push("")}}for(var J=0,G=I.length;J<G;++J){H=z[N.engine](E,B?n.textAlign(I[J],C,J,G):I[J],C,N,F,D,J<G-1);if(H){K.appendChild(H)}}return K}function l(D,M){var C=D.nodeName.toLowerCase();if(M.ignore[C]){return}var E=!M.textless[C];var B=n.getStyle(v(D,M)).extend(M);var F=c(D,B),G,K,I,H,L,J;if(!F){return}for(G=D.firstChild;G;G=I){K=G.nodeType;I=G.nextSibling;if(E&&K==3){if(H){H.appendData(G.data);D.removeChild(G)}else{H=G}if(I){continue}}if(H){D.replaceChild(o(F,n.whiteSpace(H.data,B,H,J),B,M,G,D),H);H=null}if(K==1){if(G.firstChild){if(G.nodeName.toLowerCase()=="cufon"){z[M.engine](F,null,B,M,G,D)}else{arguments.callee(G,M)}}J=G}}}var t=" ".split(/\s+/).length==0;var d=new A();var b=new r();var y=new u();var e=false;var z={},i={},w={autoDetect:false,engine:null,forceHitArea:false,hover:false,hoverables:{a:true},ignore:{applet:1,canvas:1,col:1,colgroup:1,head:1,iframe:1,map:1,optgroup:1,option:1,script:1,select:1,style:1,textarea:1,title:1,pre:1},printable:true,selector:(window.Sizzle||(window.jQuery&&function(B){return jQuery(B)})||(window.dojo&&dojo.query)||(window.Ext&&Ext.query)||(window.YAHOO&&YAHOO.util&&YAHOO.util.Selector&&YAHOO.util.Selector.query)||(window.$$&&function(B){return $$(B)})||(window.$&&function(B){return $(B)})||(document.querySelectorAll&&function(B){return document.querySelectorAll(B)})||g),separate:"words",textless:{dl:1,html:1,ol:1,table:1,tbody:1,thead:1,tfoot:1,tr:1,ul:1},textShadow:"none"};var p={words:/\s/.test("\u00a0")?/[^\S\u00a0]+/:/\s+/,characters:"",none:/^/};m.now=function(){x.ready();return m};m.refresh=function(){y.repeat.apply(y,arguments);return m};m.registerEngine=function(C,B){if(!B){return m}z[C]=B;return m.set("engine",C)};m.registerFont=function(D){if(!D){return m}var B=new s(D),C=B.family;if(!i[C]){i[C]=new f()}i[C].add(B);return m.set("fontFamily",'"'+C+'"')};m.replace=function(D,C,B){C=h(w,C);if(!C.engine){return m}if(!e){n.addClass(x.root(),"cufon-active cufon-loading");n.ready(function(){n.addClass(n.removeClass(x.root(),"cufon-loading"),"cufon-ready")});e=true}if(C.hover){C.forceHitArea=true}if(C.autoDetect){delete C.fontFamily}if(typeof C.textShadow=="string"){C.textShadow=n.textShadow(C.textShadow)}if(typeof C.color=="string"&&/^-/.test(C.color)){C.textGradient=n.gradient(C.color)}else{delete C.textGradient}if(!B){y.add(D,arguments)}if(D.nodeType||typeof D=="string"){D=[D]}n.ready(function(){for(var F=0,E=D.length;F<E;++F){var G=D[F];if(typeof G=="string"){m.replace(C.selector(G),C,true)}else{l(G,C)}}});return m};m.set=function(B,C){w[B]=C;return m};return m})();Cufon.registerEngine("vml",(function(){var e=document.namespaces;if(!e){return}e.add("cvml","urn:schemas-microsoft-com:vml");e=null;var b=document.createElement("cvml:shape");b.style.behavior="url(#default#VML)";if(!b.coordsize){return}b=null;var h=(document.documentMode||0)<8;document.write(('<style type="text/css">cufoncanvas{text-indent:0;}@media screen{cvml\\:shape,cvml\\:rect,cvml\\:fill,cvml\\:shadow{behavior:url(#default#VML);display:block;antialias:true;position:absolute;}cufoncanvas{position:absolute;text-align:left;}cufon{display:inline-block;position:relative;vertical-align:'+(h?"middle":"text-bottom")+";}cufon cufontext{position:absolute;left:-10000in;font-size:1px;}a cufon{cursor:pointer}}@media print{cufon cufoncanvas{display:none;}}</style>").replace(/;/g,"!important;"));function c(i,j){return a(i,/(?:em|ex|%)$|^[a-z-]+$/i.test(j)?"1em":j)}function a(l,m){if(m==="0"){return 0}if(/px$/i.test(m)){return parseFloat(m)}var k=l.style.left,j=l.runtimeStyle.left;l.runtimeStyle.left=l.currentStyle.left;l.style.left=m.replace("%","em");var i=l.style.pixelLeft;l.style.left=k;l.runtimeStyle.left=j;return i}function f(l,k,j,n){var i="computed"+n,m=k[i];if(isNaN(m)){m=k.get(n);k[i]=m=(m=="normal")?0:~~j.convertFrom(a(l,m))}return m}var g={};function d(p){var q=p.id;if(!g[q]){var n=p.stops,o=document.createElement("cvml:fill"),i=[];o.type="gradient";o.angle=180;o.focus="0";o.method="sigma";o.color=n[0][1];for(var m=1,l=n.length-1;m<l;++m){i.push(n[m][0]*100+"% "+n[m][1])}o.colors=i.join(",");o.color2=n[l][1];g[q]=o}return g[q]}return function(ac,G,Y,C,K,ad,W){var n=(G===null);if(n){G=K.alt}var I=ac.viewBox;var p=Y.computedFontSize||(Y.computedFontSize=new Cufon.CSS.Size(c(ad,Y.get("fontSize"))+"px",ac.baseSize));var y,q;if(n){y=K;q=K.firstChild}else{y=document.createElement("cufon");y.className="cufon cufon-vml";y.alt=G;q=document.createElement("cufoncanvas");y.appendChild(q);if(C.printable){var Z=document.createElement("cufontext");Z.appendChild(document.createTextNode(G));y.appendChild(Z)}if(!W){y.appendChild(document.createElement("cvml:shape"))}}var ai=y.style;var R=q.style;var l=p.convert(I.height),af=Math.ceil(l);var V=af/l;var P=V*Cufon.CSS.fontStretch(Y.get("fontStretch"));var U=I.minX,T=I.minY;R.height=af;R.top=Math.round(p.convert(T-ac.ascent));R.left=Math.round(p.convert(U));ai.height=p.convert(ac.height)+"px";var F=Y.get("color");var ag=Cufon.CSS.textTransform(G,Y).split("");var L=ac.spacing(ag,f(ad,Y,p,"letterSpacing"),f(ad,Y,p,"wordSpacing"));if(!L.length){return null}var k=L.total;var x=-U+k+(I.width-L[L.length-1]);var ah=p.convert(x*P),X=Math.round(ah);var O=x+","+I.height,m;var J="r"+O+"ns";var u=C.textGradient&&d(C.textGradient);var o=ac.glyphs,S=0;var H=C.textShadow;var ab=-1,aa=0,w;while(w=ag[++ab]){var D=o[ag[ab]]||ac.missingGlyph,v;if(!D){continue}if(n){v=q.childNodes[aa];while(v.firstChild){v.removeChild(v.firstChild)}}else{v=document.createElement("cvml:shape");q.appendChild(v)}v.stroked="f";v.coordsize=O;v.coordorigin=m=(U-S)+","+T;v.path=(D.d?"m"+D.d+"xe":"")+"m"+m+J;v.fillcolor=F;if(u){v.appendChild(u.cloneNode(false))}var ae=v.style;ae.width=X;ae.height=af;if(H){var s=H[0],r=H[1];var B=Cufon.CSS.color(s.color),z;var N=document.createElement("cvml:shadow");N.on="t";N.color=B.color;N.offset=s.offX+","+s.offY;if(r){z=Cufon.CSS.color(r.color);N.type="double";N.color2=z.color;N.offset2=r.offX+","+r.offY}N.opacity=B.opacity||(z&&z.opacity)||1;v.appendChild(N)}S+=L[aa++]}var M=v.nextSibling,t,A;if(C.forceHitArea){if(!M){M=document.createElement("cvml:rect");M.stroked="f";M.className="cufon-vml-cover";t=document.createElement("cvml:fill");t.opacity=0;M.appendChild(t);q.appendChild(M)}A=M.style;A.width=X;A.height=af}else{if(M){q.removeChild(M)}}ai.width=Math.max(Math.ceil(p.convert(k*P)),0);if(h){var Q=Y.computedYAdjust;if(Q===undefined){var E=Y.get("lineHeight");if(E=="normal"){E="1em"}else{if(!isNaN(E)){E+="em"}}Y.computedYAdjust=Q=0.5*(a(ad,E)-parseFloat(ai.height))}if(Q){ai.marginTop=Math.ceil(Q)+"px";ai.marginBottom=Q+"px"}}return y}})());Cufon.registerEngine("canvas",(function(){var b=document.createElement("canvas");if(!b||!b.getContext||!b.getContext.apply){return}b=null;var a=Cufon.CSS.supports("display","inline-block");var e=!a&&(document.compatMode=="BackCompat"||/frameset|transitional/i.test(document.doctype.publicId));var f=document.createElement("style");f.type="text/css";f.appendChild(document.createTextNode(("cufon{text-indent:0;}@media screen,projection{cufon{display:inline;display:inline-block;position:relative;vertical-align:middle;"+(e?"":"font-size:1px;line-height:1px;")+"}cufon cufontext{display:-moz-inline-box;display:inline-block;width:0;height:0;overflow:hidden;text-indent:-10000in;}"+(a?"cufon canvas{position:relative;}":"cufon canvas{position:absolute;}")+"}@media print{cufon{padding:0;}cufon canvas{display:none;}}").replace(/;/g,"!important;")));document.getElementsByTagName("head")[0].appendChild(f);function d(p,h){var n=0,m=0;var g=[],o=/([mrvxe])([^a-z]*)/g,k;generate:for(var j=0;k=o.exec(p);++j){var l=k[2].split(",");switch(k[1]){case"v":g[j]={m:"bezierCurveTo",a:[n+~~l[0],m+~~l[1],n+~~l[2],m+~~l[3],n+=~~l[4],m+=~~l[5]]};break;case"r":g[j]={m:"lineTo",a:[n+=~~l[0],m+=~~l[1]]};break;case"m":g[j]={m:"moveTo",a:[n=~~l[0],m=~~l[1]]};break;case"x":g[j]={m:"closePath"};break;case"e":break generate}h[g[j].m].apply(h,g[j].a)}return g}function c(m,k){for(var j=0,h=m.length;j<h;++j){var g=m[j];k[g.m].apply(k,g.a)}}return function(V,w,P,t,C,W){var k=(w===null);if(k){w=C.getAttribute("alt")}var A=V.viewBox;var m=P.getSize("fontSize",V.baseSize);var B=0,O=0,N=0,u=0;var z=t.textShadow,L=[];if(z){for(var U=z.length;U--;){var F=z[U];var K=m.convertFrom(parseFloat(F.offX));var I=m.convertFrom(parseFloat(F.offY));L[U]=[K,I];if(I<B){B=I}if(K>O){O=K}if(I>N){N=I}if(K<u){u=K}}}var Z=Cufon.CSS.textTransform(w,P).split("");var E=V.spacing(Z,~~m.convertFrom(parseFloat(P.get("letterSpacing"))||0),~~m.convertFrom(parseFloat(P.get("wordSpacing"))||0));if(!E.length){return null}var h=E.total;O+=A.width-E[E.length-1];u+=A.minX;var s,n;if(k){s=C;n=C.firstChild}else{s=document.createElement("cufon");s.className="cufon cufon-canvas";s.setAttribute("alt",w);n=document.createElement("canvas");s.appendChild(n);if(t.printable){var S=document.createElement("cufontext");S.appendChild(document.createTextNode(w));s.appendChild(S)}}var aa=s.style;var H=n.style;var j=m.convert(A.height);var Y=Math.ceil(j);var M=Y/j;var G=M*Cufon.CSS.fontStretch(P.get("fontStretch"));var J=h*G;var Q=Math.ceil(m.convert(J+O-u));var o=Math.ceil(m.convert(A.height-B+N));n.width=Q;n.height=o;H.width=Q+"px";H.height=o+"px";B+=A.minY;H.top=Math.round(m.convert(B-V.ascent))+"px";H.left=Math.round(m.convert(u))+"px";var r=Math.max(Math.ceil(m.convert(J)),0)+"px";if(a){aa.width=r;aa.height=m.convert(V.height)+"px"}else{aa.paddingLeft=r;aa.paddingBottom=(m.convert(V.height)-1)+"px"}var X=n.getContext("2d"),D=j/A.height;X.scale(D,D*M);X.translate(-u,-B);X.save();function T(){var x=V.glyphs,ab,l=-1,g=-1,y;X.scale(G,1);while(y=Z[++l]){var ab=x[Z[l]]||V.missingGlyph;if(!ab){continue}if(ab.d){X.beginPath();if(ab.code){c(ab.code,X)}else{ab.code=d("m"+ab.d,X)}X.fill()}X.translate(E[++g],0)}X.restore()}if(z){for(var U=z.length;U--;){var F=z[U];X.save();X.fillStyle=F.color;X.translate.apply(X,L[U]);T()}}var q=t.textGradient;if(q){var v=q.stops,p=X.createLinearGradient(0,A.minY,0,A.maxY);for(var U=0,R=v.length;U<R;++U){p.addColorStop.apply(p,v[U])}X.fillStyle=p}else{X.fillStyle=P.get("color")}T();return s}})());
| + | |
| - | </script>
| + | |
| - | <script type="text/javascript">
| + | |
| - | Cufon.replace('h1',{ textShadow: '1px 1px #000'});
| + | |
| - | Cufon.replace('h2',{ textShadow: '1px 1px #000'});
| + | |
| - | Cufon.replace('.footer',{ textShadow: '1px 1px #000'});
| + | |
| - | Cufon.replace('.pxs_loading',{ textShadow: '1px 1px #000'});
| + | |
| - | </script>
| + | |
| - | </head>
| + | |
| - | <body>
| + | |
| - | <div id="pxs_container" class="pxs_container">
| + | |
| - | <div class="pxs_bg">
| + | |
| - | <div class="pxs_bg1"></div>
| + | |
| - | <div class="pxs_bg2"></div>
| + | |
| - | <div class="pxs_bg3"></div>
| + | |
| - | </div>
| + | |
| - | <div class="pxs_loading">Loading images...</div>
| + | |
| - | <div class="pxs_slider_wrapper">
| + | |
| - | <ul class="pxs_slider">
| + | |
| - | <li><div><img src="https://static.igem.org/mediawiki/2012/thumb/7/79/Unamgenomicsmexiconewselmanana.JPG/850px-Unamgenomicsmexiconewselmanana.JPG" alt="First Image" width="760px" height="280px"/>
| + | |
| - | <p align="center">This is some text!</p></div>
| + | |
| - | </li>
| + | |
| - | <li><img src="https://static.igem.org/mediawiki/2012/thumb/4/4a/Unamgenomicsmexicoelsoldetampico.JPG/800px-Unamgenomicsmexicoelsoldetampico.JPG" alt="Second Image" /></li>
| + | |
| - | <li><img src="https://static.igem.org/mediawiki/2012/thumb/9/9a/Unamgenomicsmexiconewslajornada.JPG/850px-Unamgenomicsmexiconewslajornada.JPG" alt="Third Image" /></li>
| + | |
| - | </ul>
| + | |
| - | <div class="pxs_navigation">
| + | |
| - | <span class="pxs_next"></span>
| + | |
| - | <span class="pxs_prev"></span>
| + | |
| - | </div>
| + | |
| - | <ul class="pxs_thumbnails">
| + | |
| - | <li><img src="https://static.igem.org/mediawiki/2012/thumb/7/79/Unamgenomicsmexiconewselmanana.JPG/850px-Unamgenomicsmexiconewselmanana.JPG" alt="First Image" width="100px"/></li>
| + | |
| - | <li><img src="https://static.igem.org/mediawiki/2012/thumb/4/4a/Unamgenomicsmexicoelsoldetampico.JPG/800px-Unamgenomicsmexicoelsoldetampico.JPG" alt="Second Image" width="100px"/></li>
| + | |
| - | <li><img src="https://static.igem.org/mediawiki/2012/thumb/9/9a/Unamgenomicsmexiconewslajornada.JPG/850px-Unamgenomicsmexiconewslajornada.JPG" alt="Third Image" width="100px"/></li>
| + | |
| - | </ul>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| | | | |
| - | <!-- The JavaScript -->
| |
| - | <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
| |
| - | <script type="text/javascript">
| |
| - | /*
| |
| - | * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
| |
| - | *
| |
| - | * Uses the built in easing capabilities added In jQuery 1.1
| |
| - | * to offer multiple easing options
| |
| - | *
| |
| - | * TERMS OF USE - jQuery Easing
| |
| - | *
| |
| - | * Open source under the BSD License.
| |
| - | *
| |
| - | * Copyright © 2008 George McGinley Smith
| |
| - | * All rights reserved.
| |
| - | *
| |
| - | * Redistribution and use in source and binary forms, with or without modification,
| |
| - | * are permitted provided that the following conditions are met:
| |
| - | *
| |
| - | * Redistributions of source code must retain the above copyright notice, this list of
| |
| - | * conditions and the following disclaimer.
| |
| - | * Redistributions in binary form must reproduce the above copyright notice, this list
| |
| - | * of conditions and the following disclaimer in the documentation and/or other materials
| |
| - | * provided with the distribution.
| |
| - | *
| |
| - | * Neither the name of the author nor the names of contributors may be used to endorse
| |
| - | * or promote products derived from this software without specific prior written permission.
| |
| - | *
| |
| - | * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
| |
| - | * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
| |
| - | * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
| |
| - | * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
| |
| - | * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
| |
| - | * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
| |
| - | * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
| |
| - | * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
| |
| - | * OF THE POSSIBILITY OF SUCH DAMAGE.
| |
| - | *
| |
| - | */
| |
| | | | |
| - | // t: current time, b: begInnIng value, c: change In value, d: duration
| + | <html> |
| - | jQuery.easing['jswing'] = jQuery.easing['swing'];
| + | <div class="top-slider-main"> |
| | + | <div class="slider-box1"> |
| | + | <div class="left"><br /><center></center></div> |
| | + | <div class="content"><a href="#"><img src="https://static.igem.org/mediawiki/2012/3/36/UnamgenomicsowerviewSlider1.png" height="450"></a></div> |
| | + | </div> |
| | + | |
| | + | <div class="slider-box2"> |
| | + | <div class="left"><br /><center></center></div> |
| | + | <div class="content" valign="middle"><a href="#"><img src="https://static.igem.org/mediawiki/2012/1/1f/UnamgenomicsowerviewSlider2.png" height="450"></a></div> |
| | + | </div> |
| | + | |
| | + | <div class="slider-box3"> |
| | + | <div class="left"><br /><center></center></div> |
| | + | <div class="content"><a href="#"><img src="https://static.igem.org/mediawiki/2012/7/7f/UnamgenomicsowerviewSlider3.png" height="450"></a></div> |
| | + | </div> |
| | | | |
| - | jQuery.extend( jQuery.easing,
| + | <div class="slider-box4"> |
| - | {
| + | <div class="left"><br /><center></center></div> |
| - | def: 'easeOutQuad',
| + | <div class="content"><a href="#"><img src="https://static.igem.org/mediawiki/2012/6/6f/UnamgenomicsowerviewSlider4.png" height="450"></a></div> |
| - | swing: function (x, t, b, c, d) {
| + | </div> |
| - | //alert(jQuery.easing.default);
| + | |
| - | return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
| + | <div class="slider-box5"> |
| - | },
| + | <div class="left"><br /><center></center></div> |
| - | easeInQuad: function (x, t, b, c, d) {
| + | <div class="content"><a href="#"><img src="https://static.igem.org/mediawiki/2012/f/f6/UnamgenomicsoverviewIgem_logo_lento_grande.gif" height="500"></a></div> |
| - | return c*(t/=d)*t + b;
| + | </div> |
| - | },
| + | |
| - | easeOutQuad: function (x, t, b, c, d) {
| + | <div class="slider-box6"> |
| - | return -c *(t/=d)*(t-2) + b;
| + | <div class="left"><br /><center></center></div> |
| - | },
| + | <div class="content"><iframe width="450" height="460" src="#" frameborder="0" allowfullscreen></iframe></div> |
| - | easeInOutQuad: function (x, t, b, c, d) {
| + | </div> |
| - | if ((t/=d/2) < 1) return c/2*t*t + b;
| + | </div> |
| - | return -c/2 * ((--t)*(t-2) - 1) + b;
| + | |
| - | },
| + | |
| - | easeInCubic: function (x, t, b, c, d) {
| + | |
| - | return c*(t/=d)*t*t + b;
| + | |
| - | },
| + | |
| - | easeOutCubic: function (x, t, b, c, d) {
| + | |
| - | return c*((t=t/d-1)*t*t + 1) + b;
| + | |
| - | },
| + | |
| - | easeInOutCubic: function (x, t, b, c, d) {
| + | |
| - | if ((t/=d/2) < 1) return c/2*t*t*t + b;
| + | |
| - | return c/2*((t-=2)*t*t + 2) + b;
| + | |
| - | },
| + | |
| - | easeInQuart: function (x, t, b, c, d) {
| + | |
| - | return c*(t/=d)*t*t*t + b;
| + | |
| - | },
| + | |
| - | easeOutQuart: function (x, t, b, c, d) {
| + | |
| - | return -c * ((t=t/d-1)*t*t*t - 1) + b;
| + | |
| - | },
| + | |
| - | easeInOutQuart: function (x, t, b, c, d) {
| + | |
| - | if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
| + | |
| - | return -c/2 * ((t-=2)*t*t*t - 2) + b;
| + | |
| - | },
| + | |
| - | easeInQuint: function (x, t, b, c, d) {
| + | |
| - | return c*(t/=d)*t*t*t*t + b;
| + | |
| - | },
| + | |
| - | easeOutQuint: function (x, t, b, c, d) {
| + | |
| - | return c*((t=t/d-1)*t*t*t*t + 1) + b;
| + | |
| - | },
| + | |
| - | easeInOutQuint: function (x, t, b, c, d) {
| + | |
| - | if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
| + | |
| - | return c/2*((t-=2)*t*t*t*t + 2) + b;
| + | |
| - | },
| + | |
| - | easeInSine: function (x, t, b, c, d) {
| + | |
| - | return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
| + | |
| - | },
| + | |
| - | easeOutSine: function (x, t, b, c, d) {
| + | |
| - | return c * Math.sin(t/d * (Math.PI/2)) + b;
| + | |
| - | },
| + | |
| - | easeInOutSine: function (x, t, b, c, d) {
| + | |
| - | return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
| + | |
| - | },
| + | |
| - | easeInExpo: function (x, t, b, c, d) {
| + | |
| - | return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
| + | |
| - | },
| + | |
| - | easeOutExpo: function (x, t, b, c, d) {
| + | |
| - | return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
| + | |
| - | },
| + | |
| - | easeInOutExpo: function (x, t, b, c, d) {
| + | |
| - | if (t==0) return b;
| + | |
| - | if (t==d) return b+c;
| + | |
| - | if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
| + | |
| - | return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
| + | |
| - | },
| + | |
| - | easeInCirc: function (x, t, b, c, d) {
| + | |
| - | return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
| + | |
| - | },
| + | |
| - | easeOutCirc: function (x, t, b, c, d) {
| + | |
| - | return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
| + | |
| - | },
| + | |
| - | easeInOutCirc: function (x, t, b, c, d) {
| + | |
| - | if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
| + | |
| - | return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
| + | |
| - | },
| + | |
| - | easeInElastic: function (x, t, b, c, d) {
| + | |
| - | var s=1.70158;var p=0;var a=c;
| + | |
| - | if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
| + | |
| - | if (a < Math.abs(c)) { a=c; var s=p/4; }
| + | |
| - | else var s = p/(2*Math.PI) * Math.asin (c/a);
| + | |
| - | return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
| + | |
| - | },
| + | |
| - | easeOutElastic: function (x, t, b, c, d) {
| + | |
| - | var s=1.70158;var p=0;var a=c;
| + | |
| - | if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
| + | |
| - | if (a < Math.abs(c)) { a=c; var s=p/4; }
| + | |
| - | else var s = p/(2*Math.PI) * Math.asin (c/a);
| + | |
| - | return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
| + | |
| - | },
| + | |
| - | easeInOutElastic: function (x, t, b, c, d) {
| + | |
| - | var s=1.70158;var p=0;var a=c;
| + | |
| - | if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);
| + | |
| - | if (a < Math.abs(c)) { a=c; var s=p/4; }
| + | |
| - | else var s = p/(2*Math.PI) * Math.asin (c/a);
| + | |
| - | if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
| + | |
| - | return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
| + | |
| - | },
| + | |
| - | easeInBack: function (x, t, b, c, d, s) {
| + | |
| - | if (s == undefined) s = 1.70158;
| + | |
| - | return c*(t/=d)*t*((s+1)*t - s) + b;
| + | |
| - | },
| + | |
| - | easeOutBack: function (x, t, b, c, d, s) {
| + | |
| - | if (s == undefined) s = 1.70158;
| + | |
| - | return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
| + | |
| - | },
| + | |
| - | easeInOutBack: function (x, t, b, c, d, s) {
| + | |
| - | if (s == undefined) s = 1.70158;
| + | |
| - | if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
| + | |
| - | return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
| + | |
| - | },
| + | |
| - | easeInBounce: function (x, t, b, c, d) {
| + | |
| - | return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
| + | |
| - | },
| + | |
| - | easeOutBounce: function (x, t, b, c, d) {
| + | |
| - | if ((t/=d) < (1/2.75)) {
| + | |
| - | return c*(7.5625*t*t) + b;
| + | |
| - | } else if (t < (2/2.75)) {
| + | |
| - | return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
| + | |
| - | } else if (t < (2.5/2.75)) {
| + | |
| - | return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
| + | |
| - | } else {
| + | |
| - | return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
| + | |
| - | }
| + | |
| - | },
| + | |
| - | easeInOutBounce: function (x, t, b, c, d) {
| + | |
| - | if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
| + | |
| - | return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
| + | |
| - | }
| + | |
| - | });
| + | |
| | | | |
| - | /*
| + | </html> |
| - | *
| + | |
| - | * TERMS OF USE - EASING EQUATIONS
| + | |
| - | *
| + | |
| - | * Open source under the BSD License.
| + | |
| - | *
| + | |
| - | * Copyright © 2001 Robert Penner
| + | |
| - | * All rights reserved.
| + | |
| - | *
| + | |
| - | * Redistribution and use in source and binary forms, with or without modification,
| + | |
| - | * are permitted provided that the following conditions are met:
| + | |
| - | *
| + | |
| - | * Redistributions of source code must retain the above copyright notice, this list of
| + | |
| - | * conditions and the following disclaimer.
| + | |
| - | * Redistributions in binary form must reproduce the above copyright notice, this list
| + | |
| - | * of conditions and the following disclaimer in the documentation and/or other materials
| + | |
| - | * provided with the distribution.
| + | |
| - | *
| + | |
| - | * Neither the name of the author nor the names of contributors may be used to endorse
| + | |
| - | * or promote products derived from this software without specific prior written permission.
| + | |
| - | *
| + | |
| - | * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
| + | |
| - | * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
| + | |
| - | * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
| + | |
| - | * COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
| + | |
| - | * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
| + | |
| - | * GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
| + | |
| - | * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
| + | |
| - | * NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
| + | |
| - | * OF THE POSSIBILITY OF SUCH DAMAGE.
| + | |
| - | *
| + | |
| - | */
| + | |
| - | </script>
| + | |
| - | <script type="text/javascript">
| + | |
| - | (function($) {
| + | |
| - | $.fn.parallaxSlider = function(options) {
| + | |
| - | var opts = $.extend({}, $.fn.parallaxSlider.defaults, options);
| + | |
| - | return this.each(function() {
| + | |
| - | var $pxs_container = $(this),
| + | |
| - | o = $.meta ? $.extend({}, opts, $pxs_container.data()) : opts;
| + | |
| - |
| + | |
| - | //the main slider
| + | |
| - | var $pxs_slider = $('.pxs_slider',$pxs_container),
| + | |
| - | //the elements in the slider
| + | |
| - | $elems = $pxs_slider.children(),
| + | |
| - | //total number of elements
| + | |
| - | total_elems = $elems.length,
| + | |
| - | //the navigation buttons
| + | |
| - | $pxs_next = $('.pxs_next',$pxs_container),
| + | |
| - | $pxs_prev = $('.pxs_prev',$pxs_container),
| + | |
| - | //the bg images
| + | |
| - | $pxs_bg1 = $('.pxs_bg1',$pxs_container),
| + | |
| - | $pxs_bg2 = $('.pxs_bg2',$pxs_container),
| + | |
| - | $pxs_bg3 = $('.pxs_bg3',$pxs_container),
| + | |
| - | //current image
| + | |
| - | current = 0,
| + | |
| - | //the thumbs container
| + | |
| - | $pxs_thumbnails = $('.pxs_thumbnails',$pxs_container),
| + | |
| - | //the thumbs
| + | |
| - | $thumbs = $pxs_thumbnails.children(),
| + | |
| - | //the interval for the autoplay mode
| + | |
| - | slideshow,
| + | |
| - | //the loading image
| + | |
| - | $pxs_loading = $('.pxs_loading',$pxs_container),
| + | |
| - | $pxs_slider_wrapper = $('.pxs_slider_wrapper',$pxs_container);
| + | |
| - |
| + | |
| - | //first preload all the images
| + | |
| - | var loaded = 0,
| + | |
| - | $images = $pxs_slider_wrapper.find('img');
| + | |
| - |
| + | |
| - | $images.each(function(){
| + | |
| - | var $img = $(this);
| + | |
| - | $('<img/>').load(function(){
| + | |
| - | ++loaded;
| + | |
| - | if(loaded == total_elems*2){
| + | |
| - | $pxs_loading.hide();
| + | |
| - | $pxs_slider_wrapper.show();
| + | |
| - |
| + | |
| - | //one images width (assuming all images have the same sizes)
| + | |
| - | var one_image_w = $pxs_slider.find('img:first').width();
| + | |
| - |
| + | |
| - | /*
| + | |
| - | need to set width of the slider,
| + | |
| - | of each one of its elements, and of the
| + | |
| - | navigation buttons
| + | |
| - | */
| + | |
| - | setWidths($pxs_slider,
| + | |
| - | $elems,
| + | |
| - | total_elems,
| + | |
| - | $pxs_bg1,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg3,
| + | |
| - | one_image_w,
| + | |
| - | $pxs_next,
| + | |
| - | $pxs_prev);
| + | |
| - |
| + | |
| - | /*
| + | |
| - | set the width of the thumbs
| + | |
| - | and spread them evenly
| + | |
| - | */
| + | |
| - | $pxs_thumbnails.css({
| + | |
| - | 'width' : one_image_w + 'px',
| + | |
| - | 'margin-left' : -one_image_w/2 + 'px'
| + | |
| - | });
| + | |
| - | var spaces = one_image_w/(total_elems+1);
| + | |
| - | $thumbs.each(function(i){
| + | |
| - | var $this = $(this);
| + | |
| - | var left = spaces*(i+1) - $this.width()/2;
| + | |
| - | $this.css('left',left+'px');
| + | |
| - |
| + | |
| - | if(o.thumbRotation){
| + | |
| - | var angle = Math.floor(Math.random()*41)-20;
| + | |
| - | $this.css({
| + | |
| - | '-moz-transform' : 'rotate('+ angle +'deg)',
| + | |
| - | '-webkit-transform' : 'rotate('+ angle +'deg)',
| + | |
| - | 'transform' : 'rotate('+ angle +'deg)'
| + | |
| - | });
| + | |
| - | }
| + | |
| - | //hovering the thumbs animates them up and down
| + | |
| - | $this.bind('mouseenter',function(){
| + | |
| - | $(this).stop().animate({top:'-10px'},100);
| + | |
| - | }).bind('mouseleave',function(){
| + | |
| - | $(this).stop().animate({top:'0px'},100);
| + | |
| - | });
| + | |
| - | });
| + | |
| - |
| + | |
| - | //make the first thumb be selected
| + | |
| - | highlight($thumbs.eq(0));
| + | |
| - |
| + | |
| - | //slide when clicking the navigation buttons
| + | |
| - | $pxs_next.bind('click',function(){
| + | |
| - | ++current;
| + | |
| - | if(current >= total_elems)
| + | |
| - | if(o.circular)
| + | |
| - | current = 0;
| + | |
| - | else{
| + | |
| - | --current;
| + | |
| - | return false;
| + | |
| - | }
| + | |
| - | highlight($thumbs.eq(current));
| + | |
| - | slide(current,
| + | |
| - | $pxs_slider,
| + | |
| - | $pxs_bg3,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg1,
| + | |
| - | o.speed,
| + | |
| - | o.easing,
| + | |
| - | o.easingBg);
| + | |
| - | });
| + | |
| - | $pxs_prev.bind('click',function(){
| + | |
| - | --current;
| + | |
| - | if(current < 0)
| + | |
| - | if(o.circular)
| + | |
| - | current = total_elems - 1;
| + | |
| - | else{
| + | |
| - | ++current;
| + | |
| - | return false;
| + | |
| - | }
| + | |
| - | highlight($thumbs.eq(current));
| + | |
| - | slide(current,
| + | |
| - | $pxs_slider,
| + | |
| - | $pxs_bg3,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg1,
| + | |
| - | o.speed,
| + | |
| - | o.easing,
| + | |
| - | o.easingBg);
| + | |
| - | });
| + | |
| - |
| + | |
| - | /*
| + | |
| - | clicking a thumb will slide to the respective image
| + | |
| - | */
| + | |
| - | $thumbs.bind('click',function(){
| + | |
| - | var $thumb = $(this);
| + | |
| - | highlight($thumb);
| + | |
| - | //if autoplay interrupt when user clicks
| + | |
| - | if(o.auto)
| + | |
| - | clearInterval(slideshow);
| + | |
| - | current = $thumb.index();
| + | |
| - | slide(current,
| + | |
| - | $pxs_slider,
| + | |
| - | $pxs_bg3,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg1,
| + | |
| - | o.speed,
| + | |
| - | o.easing,
| + | |
| - | o.easingBg);
| + | |
| - | });
| + | |
| - |
| + | |
| - |
| + | |
| - |
| + | |
| - | /*
| + | |
| - | activate the autoplay mode if
| + | |
| - | that option was specified
| + | |
| - | */
| + | |
| - | if(o.auto != 0){
| + | |
| - | o.circular = true;
| + | |
| - | slideshow = setInterval(function(){
| + | |
| - | $pxs_next.trigger('click');
| + | |
| - | },o.auto);
| + | |
| - | }
| + | |
| - |
| + | |
| - | /*
| + | |
| - | when resizing the window,
| + | |
| - | we need to recalculate the widths of the
| + | |
| - | slider elements, based on the new windows width.
| + | |
| - | we need to slide again to the current one,
| + | |
| - | since the left of the slider is no longer correct
| + | |
| - | */
| + | |
| - | $(window).resize(function(){
| + | |
| - | w_w = $(window).width();
| + | |
| - | setWidths($pxs_slider,$elems,total_elems,$pxs_bg1,$pxs_bg2,$pxs_bg3,one_image_w,$pxs_next,$pxs_prev);
| + | |
| - | slide(current,
| + | |
| - | $pxs_slider,
| + | |
| - | $pxs_bg3,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg1,
| + | |
| - | 1,
| + | |
| - | o.easing,
| + | |
| - | o.easingBg);
| + | |
| - | });
| + | |
| | | | |
| - | }
| + | <html> |
| - | }).error(function(){
| + | <object id="prezi_a869181a4a2b0325fab1d1aef51326bb1826c610" name="prezi_a869181a4a2b0325fab1d1aef51326bb1826c610" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600"><param name="movie" value="http://prezi.com/bin/preziloader.swf"/><param name="allowfullscreen" value="true"/><param name="allowFullScreenInteractive" value="true"/><param name="allowscriptaccess" value="always"/><param name="bgcolor" value="#ffffff"/><param name="flashvars" value="prezi_id=a869181a4a2b0325fab1d1aef51326bb1826c610&lock_to_path=0&color=ffffff&autoplay=no&autohide_ctrls=0"/><embed id="preziEmbed_a869181a4a2b0325fab1d1aef51326bb1826c610" name="preziEmbed_a869181a4a2b0325fab1d1aef51326bb1826c610" src="http://prezi.com/bin/preziloader.swf" type="application/x-shockwave-flash" allowfullscreen="true" allowFullScreenInteractive="true" allowscriptaccess="always" width="800" height="600" bgcolor="#ffffff" flashvars="prezi_id=a869181a4a2b0325fab1d1aef51326bb1826c610&lock_to_path=0&color=ffffff&autoplay=no&autohide_ctrls=0"></embed></object> |
| - | alert('here')
| + | |
| - | }).attr('src',$img.attr('src'));
| + | |
| - | });
| + | |
| - |
| + | |
| - |
| + | |
| - |
| + | |
| - | });
| + | |
| - | };
| + | |
| - |
| + | |
| - | //the current windows width
| + | |
| - | var w_w = $(window).width();
| + | |
| - |
| + | |
| - | var slide = function(current,
| + | |
| - | $pxs_slider,
| + | |
| - | $pxs_bg3,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg1,
| + | |
| - | speed,
| + | |
| - | easing,
| + | |
| - | easingBg){
| + | |
| - | var slide_to = parseInt(-w_w * current);
| + | |
| - | $pxs_slider.stop().animate({
| + | |
| - | left : slide_to + 'px'
| + | |
| - | },speed, easing);
| + | |
| - | $pxs_bg3.stop().animate({
| + | |
| - | left : slide_to/2 + 'px'
| + | |
| - | },speed, easingBg);
| + | |
| - | $pxs_bg2.stop().animate({
| + | |
| - | left : slide_to/4 + 'px'
| + | |
| - | },speed, easingBg);
| + | |
| - | $pxs_bg1.stop().animate({
| + | |
| - | left : slide_to/8 + 'px'
| + | |
| - | },speed, easingBg);
| + | |
| - | }
| + | |
| - |
| + | |
| - | var highlight = function($elem){
| + | |
| - | $elem.siblings().removeClass('selected');
| + | |
| - | $elem.addClass('selected');
| + | |
| - | }
| + | |
| - |
| + | |
| - | var setWidths = function($pxs_slider,
| + | |
| - | $elems,
| + | |
| - | total_elems,
| + | |
| - | $pxs_bg1,
| + | |
| - | $pxs_bg2,
| + | |
| - | $pxs_bg3,
| + | |
| - | one_image_w,
| + | |
| - | $pxs_next,
| + | |
| - | $pxs_prev){
| + | |
| - | /*
| + | |
| - | the width of the slider is the windows width
| + | |
| - | times the total number of elements in the slider
| + | |
| - | */
| + | |
| - | var pxs_slider_w = w_w * total_elems;
| + | |
| - | $pxs_slider.width(pxs_slider_w + 'px');
| + | |
| - | //each element will have a width = windows width
| + | |
| - | $elems.width(w_w + 'px');
| + | |
| - | /*
| + | |
| - | we also set the width of each bg image div.
| + | |
| - | The value is the same calculated for the pxs_slider
| + | |
| - | */
| + | |
| - | $pxs_bg1.width(pxs_slider_w + 'px');
| + | |
| - | $pxs_bg2.width(pxs_slider_w + 'px');
| + | |
| - | $pxs_bg3.width(pxs_slider_w + 'px');
| + | |
| - |
| + | |
| - | /*
| + | |
| - | both the right and left of the
| + | |
| - | navigation next and previous buttons will be:
| + | |
| - | windowWidth/2 - imgWidth/2 + some margin (not to touch the image borders)
| + | |
| - | */
| + | |
| - | var position_nav = w_w/2 - one_image_w/2 + 3;
| + | |
| - | $pxs_next.css('right', position_nav + 'px');
| + | |
| - | $pxs_prev.css('left', position_nav + 'px');
| + | |
| - | }
| + | |
| - |
| + | |
| - | $.fn.parallaxSlider.defaults = {
| + | |
| - | auto : 0, //how many seconds to periodically slide the content.
| + | |
| - | //If set to 0 then autoplay is turned off.
| + | |
| - | speed : 1000,//speed of each slide animation
| + | |
| - | easing : 'jswing',//easing effect for the slide animation
| + | |
| - | easingBg : 'jswing',//easing effect for the background animation
| + | |
| - | circular : true,//circular slider
| + | |
| - | thumbRotation : true//the thumbs will be randomly rotated
| + | |
| - | };
| + | |
| - | //easeInOutExpo,easeInBack
| + | |
| - | })(jQuery);
| + | |
| - | </script>
| + | |
| - | | + | |
| - | <script type="text/javascript">
| + | |
| - | $(function() {
| + | |
| - | var $pxs_container = $('#pxs_container');
| + | |
| - | $pxs_container.parallaxSlider();
| + | |
| - | });
| + | |
| - | </script>
| + | |
| - | | + | |
| - | </body>
| + | |
| | </html> | | </html> |
| - |
| |
| - |
| |
| - |
| |
| | | | |
| | }} | | }} |
"
