Difference between revisions of "Team:USTC-Software"
(fix padding) |
(fix animation) |
||
| Line 248: | Line 248: | ||
</style> | </style> | ||
| + | <div id="img" style="position: absolute; z-index: -99; top: 0; left: 0;"></div> | ||
| + | <div id="mask" style="position: absolute; z-index: -98; top: 0; left: 0; background: white; display: none;"></div> | ||
<div class="container"> | <div class="container"> | ||
<nav class="header"> | <nav class="header"> | ||
| Line 557: | Line 559: | ||
#HQ_page{ | #HQ_page{ | ||
| − | background: url("https://static.igem.org/mediawiki/2019/e/ee/T--USTC-Software--WEB.svg") center no-repeat; | + | /*background: url("https://static.igem.org/mediawiki/2019/e/ee/T--USTC-Software--WEB.svg") center no-repeat; |
| − | background-size: cover; | + | background-size: cover;*/ |
height: 98vh; | height: 98vh; | ||
| + | } | ||
| + | |||
| + | #img { | ||
| + | background-image: url("../File/T--USTC-Software--WEB.svg"); | ||
| + | background-size: cover; | ||
| + | height: 100%; | ||
| + | width: 100%; | ||
} | } | ||
</style> | </style> | ||
| Line 590: | Line 599: | ||
$(".next").on("click", function () { | $(".next").on("click", function () { | ||
| − | |||
| − | |||
changeBg(); | changeBg(); | ||
changeArrow(); | changeArrow(); | ||
}); | }); | ||
| − | + | ||
| + | function changeBg() { | ||
if (page1IsShow) { | if (page1IsShow) { | ||
| − | $(" | + | $(".page1").fadeOut(500, function() { |
| − | + | $('#mask').css({height: $(window).height(), width: $(window).width()}) | |
| − | + | .fadeIn('slow', function(){ | |
| + | $('#img').css('background-image', "url(https://static.igem.org/mediawiki/2019/6/60/T--USTC-Software--web2.svg)"); | ||
| + | $('#mask').fadeOut('slow', function() { | ||
| + | $(".page2").fadeIn(); | ||
| + | }); | ||
| + | }); | ||
}); | }); | ||
page1IsShow = false; | page1IsShow = false; | ||
} else { | } else { | ||
| − | $(" | + | $(".page2").fadeOut(500, function() { |
| − | + | $('#mask').css({height: $(window).height(), width: $(window).width()}) | |
| − | + | .fadeIn('slow', function(){ | |
| + | $('#img').css('background-image', "url(https://static.igem.org/mediawiki/2019/e/ee/T--USTC-Software--WEB.svg)"); | ||
| + | $('#mask').fadeOut('slow', function() { | ||
| + | $(".page1").fadeIn(); | ||
| + | }); | ||
| + | }); | ||
}); | }); | ||
page1IsShow = true; | page1IsShow = true; | ||
Revision as of 18:43, 21 October 2019
Foresyn
Lessen Your Needless Works
What You See Is What You Get
No Command Prompt Using Need
Comprehensive Customized Database
MORE