Team:HUST-China/template/reset
From 2013.igem.org
(Difference between revisions)
HUST Oshyn (Talk | contribs) |
HUST Oshyn (Talk | contribs) |
||
(27 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
- | <style> | + | <style type="text/css"> |
#top-section{ | #top-section{ | ||
position: absolute; | position: absolute; | ||
Line 20: | Line 20: | ||
#top-section #p-logo, | #top-section #p-logo, | ||
#top-section #search-controls, | #top-section #search-controls, | ||
- | #content h1.firstHeading, | + | #content h1.firstHeading,#footer-box, |
#content #bodyContent #contentSub, | #content #bodyContent #contentSub, | ||
#content #bodyContent p, /* holly crap, they have p element for script tag and no id and no class... */ | #content #bodyContent p, /* holly crap, they have p element for script tag and no id and no class... */ | ||
Line 33: | Line 33: | ||
border: none; | border: none; | ||
width: auto; | width: auto; | ||
+ | font-size:100%; | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
#content #bodyContent div p{ | #content #bodyContent div p{ | ||
display: block; | display: block; | ||
} | } | ||
+ | |||
+ | html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, code, em, img, q, small, strong, dd, dl, dt, li, ol, ul, fieldset, form, label, table, tbody, tr, th, td, input { | ||
+ | margin:0px; | ||
+ | border:0px; | ||
+ | padding:0px;} | ||
body{ | body{ | ||
- | font-size:14px; | + | font-size:14px; |
- | font-family:Tahoma,Helvetica,Simsun,STHeiti, | + | font-family:Tahoma,Helvetica,Simsun,STHeiti, |
- | Georgia,"Lucida Grande", Verdana, Lucida,Arial, Helvetica, 宋体,sans-serif; | + | Georgia,"Lucida Grande", Verdana, Lucida,Arial, Helvetica, 宋体,sans-serif; |
- | cursor:default; | + | cursor:default; |
- | background: #e7e9e6; | + | /*color:#fff;*/ |
- | position: relative; | + | background: #e7e9e6; |
+ | position: relative; | ||
} | } | ||
+ | h1{ text-shadow: 3px 3px 3px #ccc;} | ||
+ | h1, h2, h3, h4, h5, h6 { | ||
+ | font-family: Verdana, Lucida,Arial, Helvetica,‘Corben’, Georgia, Times, serif; | ||
+ | } | ||
+ | p, div { | ||
+ | font-family: Verdana, Lucida,Arial, Helvetica,‘Nobile’, Helvetica, Arial, sans-serif; | ||
+ | } | ||
+ | a{ | ||
+ | transition-duration:0.4s; | ||
+ | transition-property:color; | ||
+ | transition-timing-function:ease-out; | ||
+ | -o-transition-duration:0.4s; | ||
+ | -o-transition-property:color; | ||
+ | -o-transition-timing-function:ease-out; | ||
+ | -webkit-transition-duration:0.4s; | ||
+ | -webkit-transition-property: color, background-color; | ||
+ | -webkit-transition-timing-function:ease-out; | ||
+ | -moz-transition-duration:0.4s; | ||
+ | -moz-transition-property:color; | ||
+ | -moz-transition-timing-function:ease-out; | ||
+ | -ms-transition-duration:0.4s; | ||
+ | -ms-transition-property:color; | ||
+ | -ms-transition-timing-function:ease-out; | ||
+ | } | ||
+ | #bodyContent a:link{font-weight:bold;} | ||
+ | #bodyContent a:visited{font-weight:bold;} | ||
+ | #bodyContent a:hover{font-weight:bold;} | ||
+ | .standout{ | ||
+ | box-shadow: 0 0 1em 1em #ccceee; | ||
+ | } | ||
+ | .header{ | ||
+ | position: relative; | ||
+ | color: #ffffff; | ||
+ | text-align: center; | ||
+ | text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075); | ||
+ | border-bottom: 4px dashed #f2f2f2; | ||
+ | border-top: 4px dashed #f2f2f2; | ||
+ | background: linear-gradient(45deg, #020031 0%,#6d3353 100%); | ||
+ | background: -ms-linear-gradient(45deg, #020031 0%,#6d3353 100%); | ||
+ | background: -moz-linear-gradient(45deg, #020031 0%,#6d3353 100%); | ||
+ | background: -webkit-linear-gradient(45deg, #020031 0%,#6d3353 100%); | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020031', endColorstr='#6d3353',GradientType=1 ); | ||
+ | -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); | ||
+ | -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); | ||
+ | -ms-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); | ||
+ | -o-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); | ||
+ | box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); | ||
+ | } | ||
+ | .container{ | ||
+ | background: url(https://static.igem.org/mediawiki/2013/c/c9/HUST-1.png) repeat 0 0; | ||
+ | box-shadow: 5px 0px 10px 5px rgba(0,0,0,.6),-5px 0 10px 5px rgba(0,0,0,.6); | ||
+ | } | ||
+ | .footer{ | ||
+ | text-align:center; | ||
+ | color:#333; | ||
+ | padding:20px 0 30px; | ||
+ | } | ||
+ | #up{ | ||
+ | position:fixed; | ||
+ | width: 75px; | ||
+ | height:74px; | ||
+ | bottom:20px; | ||
+ | right:20px; | ||
+ | background: url(https://static.igem.org/mediawiki/2013/d/d7/HUST-top.png) 0 0 no-repeat; | ||
+ | cursor: pointer; | ||
+ | -moz-transition:background-position .5s ease-in .1s; | ||
+ | -webkit-transition:background-position .5s ease-in .1s; | ||
+ | -o-transition:background-position .5s ease-in .1s; | ||
+ | transition:background-position .5s ease-in .1s; | ||
+ | } | ||
+ | #up:hover{ | ||
+ | background-position: 0 -74px; | ||
+ | -moz-transition:background-position .5s ease-in .1s; | ||
+ | -webkit-transition:background-position .5s ease-in .1s; | ||
+ | -o-transition:background-position .5s ease-in .1s; | ||
+ | transition:background-position .5s ease-in .1s; | ||
+ | } | ||
+ | .block-left{ | ||
+ | width:350px; | ||
+ | float: left; | ||
+ | text-align: center; | ||
+ | margin-bottom: 15px; | ||
+ | } | ||
+ | .block-right{ | ||
+ | width:350px; | ||
+ | float: right; | ||
+ | margin-bottom: 15px; | ||
+ | text-align: center; | ||
+ | } | ||
+ | #Attributes ul li{ | ||
+ | padding-right: 30px; | ||
+ | } | ||
+ | .bs-docs-sidenav { | ||
+ | width: 228px; | ||
+ | margin: 30px 0 0; | ||
+ | padding: 0; | ||
+ | background-color: #fff; | ||
+ | -webkit-border-radius: 6px; | ||
+ | -moz-border-radius: 6px; | ||
+ | border-radius: 6px; | ||
+ | -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065); | ||
+ | -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065); | ||
+ | box-shadow: 0 1px 4px rgba(0,0,0,.065); | ||
+ | } | ||
+ | .bs-docs-sidenav > li > a { | ||
+ | display: block; | ||
+ | width: 190px \9; | ||
+ | margin: 0 0 -1px; | ||
+ | padding: 8px 14px; | ||
+ | border: 1px solid #e5e5e5; | ||
+ | } | ||
+ | .bs-docs-sidenav > li:first-child > a { | ||
+ | -webkit-border-radius: 6px 6px 0 0; | ||
+ | -moz-border-radius: 6px 6px 0 0; | ||
+ | border-radius: 6px 6px 0 0; | ||
+ | } | ||
+ | .bs-docs-sidenav > li:last-child > a { | ||
+ | -webkit-border-radius: 0 0 6px 6px; | ||
+ | -moz-border-radius: 0 0 6px 6px; | ||
+ | border-radius: 0 0 6px 6px; | ||
+ | } | ||
+ | .bs-docs-sidenav > .active > a { | ||
+ | position: relative; | ||
+ | z-index: 2; | ||
+ | padding: 9px 15px; | ||
+ | border: 0; | ||
+ | text-shadow: 0 1px 0 rgba(0,0,0,.15); | ||
+ | -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1); | ||
+ | -moz-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1); | ||
+ | box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1); | ||
+ | } | ||
+ | /* Chevrons */ | ||
+ | .bs-docs-sidenav .icon-chevron-right { | ||
+ | float: right; | ||
+ | margin-top: 2px; | ||
+ | margin-right: -6px; | ||
+ | opacity: .25; | ||
+ | } | ||
+ | .bs-docs-sidenav > li > a:hover { | ||
+ | background-color: #f5f5f5; | ||
+ | } | ||
+ | .bs-docs-sidenav a:hover .icon-chevron-right { | ||
+ | opacity: .5; | ||
+ | } | ||
+ | .bs-docs-sidenav .active .icon-chevron-right, | ||
+ | .bs-docs-sidenav .active a:hover .icon-chevron-right { | ||
+ | background-image: url(../img/glyphicons-halflings-white.png); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .bs-docs-sidenav.affix { | ||
+ | top: 40px; | ||
+ | } | ||
+ | .bs-docs-sidenav.affix-bottom { | ||
+ | position: absolute; | ||
+ | top: auto; | ||
+ | bottom: 270px; | ||
+ | } | ||
+ | |||
+ | /**Home page background block**/ | ||
+ | #abstract,#oscillator,#propionate,#future-work,#protocol,#modeling,#human-practice{ | ||
+ | -moz-transition:background-color 0.25s ease-in 0.1s; | ||
+ | -webkit-transition:background-color 0.25s ease-in 0.1s; | ||
+ | -o-transition:background-color 0.25s ease-in 0.1s; | ||
+ | transition:background-color 0.25s ease-in 0.1s; | ||
+ | } | ||
+ | #abstract{background:rgba(105, 226, 89, .7);} | ||
+ | #abstract:hover{background:rgba(146, 230, 135, .7);} | ||
+ | #oscillator{background:rgba(248, 222, 79,.7);} | ||
+ | #oscillator:hover{background:rgba(250, 230, 122, .7);} | ||
+ | #propionate{background:rgba(86, 193, 241,.7);} | ||
+ | #propionate:hover{background:rgba(170, 219, 241, .7);} | ||
+ | #future-work{background:rgba(66, 221, 66,.7);} | ||
+ | #future-work:hover{background:rgba(158, 245, 158,.7);} | ||
+ | #protocol{background:rgba(199, 187, 55,.7);} | ||
+ | #protocol:hover{background:rgba(213, 203, 97, .7);} | ||
+ | #human-practice {background:rgba(188, 130, 221,.7);} | ||
+ | #human-practice:hover{background:rgba(204, 168, 224, .7);} | ||
+ | #modeling{background:rgba(236, 215, 63,.7);} | ||
+ | #modeling:hover{background:rgba(238, 225, 128, .7);} | ||
+ | |||
+ | |||
+ | |||
+ | #showcase{ | ||
+ | position:relative; | ||
+ | width:100%; | ||
+ | height:auto; | ||
+ | overflow:hidden; | ||
+ | text-align:center; | ||
+ | line-height:0; | ||
+ | font-size:0; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | #showcase-cont{ | ||
+ | position:relative; | ||
+ | left:50%; | ||
+ | margin-left:-640px; | ||
+ | width:1280px; | ||
+ | height:200px; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | #showcase-cont.pc{ | ||
+ | left:50%; | ||
+ | margin-left:-640px; | ||
+ | } | ||
+ | .showcase-pho{ | ||
+ | display:block; | ||
+ | margin:0 auto; | ||
+ | width:100%; | ||
+ | height:135px; | ||
+ | visibility:hidden; | ||
+ | } | ||
+ | .showcase-inner{ | ||
+ | position:absolute; | ||
+ | display:none; | ||
+ | right:0px; | ||
+ | bottom:20px; | ||
+ | z-index:100; | ||
+ | margin-left:-480px; | ||
+ | width:68px; | ||
+ | height:28px; | ||
+ | } | ||
+ | #showcase-prev{ | ||
+ | position:absolute; | ||
+ | right:42px; | ||
+ | bottom:2px; | ||
+ | width:22px; | ||
+ | height:22px; | ||
+ | -moz-border-radius:3px; | ||
+ | -webkit-border-radius:3px; | ||
+ | -o-border-radius:3px; | ||
+ | -ms-border-radius:3px; | ||
+ | border-radius:3px; | ||
+ | background:url(https://static.igem.org/mediawiki/2013/9/9c/HUST-prev.gif) 7px 5px no-repeat; | ||
+ | background-color:#ebf3f6; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | .arrow_pre{ | ||
+ | margin:5px 0 0 1px; | ||
+ | display:none;display:inline-block\9; | ||
+ | width:7px; | ||
+ | height:13px; | ||
+ | background:url(https://static.igem.org/mediawiki/2013/9/9c/HUST-prev.gif) 0 0 no-repeat; | ||
+ | } | ||
+ | #showcase-prev:hover{ | ||
+ | background-color:#86c0e8; | ||
+ | background:none\9; | ||
+ | } | ||
+ | #showcase-next{ | ||
+ | position:absolute; | ||
+ | right:1px; | ||
+ | bottom:2px; | ||
+ | width:22px; | ||
+ | height:22px; | ||
+ | -webkit-border-radius:3px; | ||
+ | -o-border-radius:3px; | ||
+ | -moz-border-radius:3px; | ||
+ | -ms-border-radius:3px; | ||
+ | border-radius:3px; | ||
+ | background:url(https://static.igem.org/mediawiki/2013/1/11/HUST-next.gif) 9px 5px no-repeat; | ||
+ | background-color:#ebf3f6;cursor:pointer; | ||
+ | } | ||
+ | .arrow_next{ | ||
+ | margin:5px 0 0 2px; | ||
+ | display:none; | ||
+ | display:inline-block\9; | ||
+ | width:7px; | ||
+ | height:13px; | ||
+ | background:url(https://static.igem.org/mediawiki/2013/1/11/HUST-next.gif) 0 0 no-repeat; | ||
+ | } | ||
+ | #showcase-next:hover{ | ||
+ | background-color:#86c0e8; | ||
+ | background:none\9; | ||
+ | } | ||
+ | .showcase-left{ | ||
+ | position:absolute; | ||
+ | left:0; | ||
+ | top:0; | ||
+ | width:960px; | ||
+ | height:450px; | ||
+ | } | ||
+ | .showcase-right{ | ||
+ | position:absolute; | ||
+ | right:0; | ||
+ | top:0; | ||
+ | width:960px; | ||
+ | height:450px; | ||
+ | } | ||
+ | .showcase-ones{ | ||
+ | position:relative; | ||
+ | margin:0 auto; | ||
+ | width:1280px; | ||
+ | height:200px; | ||
+ | } | ||
+ | .showcase-ones img{ | ||
+ | width:1280px; | ||
+ | height:200px; | ||
+ | } | ||
+ | #showcase-current{ | ||
+ | display:block!important; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
- | <script | + | <!--showcase.js--> |
+ | <script type="text/javascript"> | ||
+ | jQuery.easing['jswing'] = jQuery.easing['swing']; | ||
+ | jQuery.extend( jQuery.easing, | ||
+ | { | ||
+ | def: 'easeOutQuad', | ||
+ | swing: function (x, t, b, c, d) { | ||
+ | //alert(jQuery.easing.default); | ||
+ | return jQuery.easing[jQuery.easing.def](x, t, b, c, d); | ||
+ | }, | ||
+ | easeInQuad: function (x, t, b, c, d) { | ||
+ | return c*(t/=d)*t + b; | ||
+ | }, | ||
+ | easeOutQuad: function (x, t, b, c, d) { | ||
+ | return -c *(t/=d)*(t-2) + 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; | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | $(function(){ | ||
+ | |||
+ | var animation={busy:false,current:0,size:0,inervalId:null}; | ||
+ | animation.size=$('.showcase-ones','#showcase-cont').length; | ||
+ | if(animation.size>1){ | ||
+ | $('#showcase-inner').show(); | ||
+ | } | ||
+ | $('.showcase-ones','#showcase-cont').css('display','none')[0].id="showcase-current"; | ||
+ | $('#showcase-cont').css('overflow','visible'); | ||
+ | |||
+ | if(!(!$.browser.msie || $.browser.version!=6)){ | ||
+ | $('.showcase-ones').each(function(){ | ||
+ | var that=this; | ||
+ | $('img',this).each(function(){ | ||
+ | var div=$('<div class="'+$(this).attr('class')+'"></div>')[0]; | ||
+ | div.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src="+$(this).attr('src')+",sizingMethod='image')"; | ||
+ | div.style.border="solid 0px #fff"; | ||
+ | var a=$('<a href="'+$(this).parent().attr('href')+'" style="cursor:pointer;"></a>'); | ||
+ | a.append(div); | ||
+ | $(that).append(a); | ||
+ | $(this).remove(); | ||
+ | }); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | $('#showcase-prev').click(function(){ | ||
+ | if(!animation.busy){ | ||
+ | clearInterval(animation.inervalId); | ||
+ | if(--animation.current<0){ | ||
+ | animation.current=animation.size-1; | ||
+ | } | ||
+ | doChange(); | ||
+ | } | ||
+ | }); | ||
+ | $('#showcase-next').click(function(){ | ||
+ | if(!animation.busy){ | ||
+ | clearInterval(animation.inervalId); | ||
+ | if(++animation.current>=animation.size){ | ||
+ | animation.current=0; | ||
+ | } | ||
+ | doChange(); | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | function doChange(){ | ||
+ | var i=Math.floor(Math.random()*2); | ||
+ | var func=i==0?showcaseChangeWay1:showcaseChangeWay2; | ||
+ | func($('.showcase-ones','#showcase-cont')[animation.current],function(){ | ||
+ | animation.busy=false; | ||
+ | animation.inervalId=setInterval(function(){ | ||
+ | $('#showcase-next').click(); | ||
+ | },5000); | ||
+ | }); | ||
+ | } | ||
+ | |||
+ | animation.inervalId=setInterval(function(){ | ||
+ | $('#showcase-next').click(); | ||
+ | },5000); | ||
+ | |||
+ | function showcaseChangeWay1(theOnes,callback){ | ||
+ | var contWidth=1280; | ||
+ | var docWidth=$(document).width(); | ||
+ | animation.busy=true; | ||
+ | $('.showcase-left','#showcase-current').animate({left:-(docWidth-contWidth)/2-contWidth},900,'easeInQuad'); | ||
+ | $('.showcase-right','#showcase-current').animate({left:-(docWidth-contWidth)/2-contWidth},900,'easeInExpo'); | ||
+ | setTimeout(function(){ | ||
+ | $(theOnes).css({position:'absolute',display:'block',left:(docWidth-contWidth)/2+contWidth,top:0}).animate({left:0},900,'easeInQuad',function(){ | ||
+ | var cur=$('#showcase-current').attr('id',''); | ||
+ | $('.showcase-left,.showcase-right',cur).css('left','0'); | ||
+ | $(theOnes).attr('id','showcase-current').css({position:'relative',display:'none',left:0}); | ||
+ | if(typeof callback=='function'){ | ||
+ | callback(); | ||
+ | } | ||
+ | }); | ||
+ | },400); | ||
+ | } | ||
- | <body> | + | function showcaseChangeWay2(theOnes,callback){ |
+ | var contWidth=1280; | ||
+ | var docWidth=$(document).width(); | ||
+ | animation.busy=true; | ||
+ | $('.showcase-left','#showcase-current').animate({left:-(docWidth-contWidth)/2-contWidth},700,'easeInQuad',function(){ | ||
+ | $(theOnes).css({position:'absolute',display:'block',left:-(docWidth-contWidth)/2-contWidth,top:0}).animate({left:0},500,'easeInQuad',function(){ | ||
+ | var cur=$('#showcase-current').attr('id',''); | ||
+ | $('.showcase-left,.showcase-right',cur).css('left','0'); | ||
+ | $(theOnes).attr('id','showcase-current').css({position:'relative',display:'none',left:0}); | ||
+ | if(typeof callback=='function'){ | ||
+ | callback(); | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | $('.showcase-right','#showcase-current').animate({left:(docWidth-contWidth)/2+contWidth},1000,'easeInExpo'); | ||
+ | } | ||
+ | }); | ||
+ | </script> | ||
+ | <!--backstretch.js--> | ||
+ | <script> | ||
+ | (function(a){a.backstretch=function(l,b,j){function m(c){try{h={left:0,top:0},e=f.width(),d=e/k,d>=f.height()?(i=(d-f.height())/2,!(!g.centeredY||!a.extend(h,{top:"-"+i+"px"}))):(d=f.height(),e=d*k,i=(e-f.width())/2,!(!g.centeredX||!a.extend(h,{left:"-"+i+"px"}))),a("#backstretch, #backstretch img:not(.deleteable)").width(e).height(d).filter("img").css(h)}catch(b){}!("function"!=typeof c || !c())}var n={centeredX:!0,centeredY:!0,speed:0},c=a("#backstretch"),g=c.data("settings")||n;c.data("settings");var f="onorientationchange"in window?a(document):a(window),k,e,d,i,h;!(!b||"object"!=typeof b||!a.extend(g,b));!(!b||"function"!=typeof b||!(j=b));a(document).ready(function(){if(l){var b;0==c.length?c=a("<div />").attr("id","backstretch").css({left:0,top:0,position:"fixed",overflow:"hidden",zIndex:-999999,margin:0,padding:0,height:"100%",width:"100%"}):c.find("img").addClass("deleteable");b=a("<img />").css({position:"absolute",display:"none",margin:0,padding:0,border:"none",zIndex:-999999}).bind("load",function(b){var d=a(this),e;d.css({width:"auto",height:"auto"});e=this.width||a(b.target).width();b=this.height||a(b.target).height();k=e/b;m(function(){d.fadeIn(g.speed,function(){c.find(".deleteable").remove();!("function"!=typeof j||!j())})})}).appendTo(c);!(0!=a("body #backstretch").length||!a("body").append(c));c.data("settings",g);b.attr("src",l);a(window).resize(m)}});return this}})(jQuery); | ||
+ | </script> |
Latest revision as of 15:18, 26 October 2013