Line 10: | Line 10: | ||
<link href="https://2016.igem.org/Team:NJU-China/mdlib/mdiconcss?action=raw&ctype=text/css" rel="stylesheet"> | <link href="https://2016.igem.org/Team:NJU-China/mdlib/mdiconcss?action=raw&ctype=text/css" rel="stylesheet"> | ||
<style> | <style> | ||
+ | /*test*/ | ||
+ | .dt-loading{background:rgba(0,0,0,0.9);width:100%;height:100%;z-index:101;text-align:center;position:fixed;top:0;bottom:0;left:0;right:0;padding:20% 0} | ||
+ | .laying{background-color:rgba(0,0,0,0);border:5px solid rgba(97,225,255,0.9);opacity:.9;border-right:5px solid rgba(0,0,0,0);border-left:5px solid rgba(0,0,0,0);border-radius:50px;box-shadow:0 0 35px #187BD8;width:50px;height:50px;margin:0 auto;-moz-animation:spinPulse 1s infinite ease-in-out;-webkit-animation:spinPulse 1s infinite ease-in-out;-o-animation:spinPulse 1s infinite ease-in-out;animation:spinPulse 1s infinite ease-in-out} | ||
+ | .layout{background-color:rgba(0,0,0,0);border:5px solid rgba(97,145,255,0.9);opacity:.9;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);border-radius:50px;box-shadow:0 0 15px #187BD8;width:30px;height:30px;margin:0 auto;position:relative;top:-50px;-moz-animation:spinoffPulse 1s infinite linear;-webkit-animation:spinoffPulse 1s infinite linear;-o-animation:spinoffPulse 1s infinite linear;animation:spinoffPulse 1s infinite linear} | ||
+ | @-moz-keyframes spinPulse{0{-moz-transform:rotate(160deg);opacity:0;box-shadow:0 0 1px #187BD8} | ||
+ | 50%{-moz-transform:rotate(145deg);opacity:1} | ||
+ | 100%{-moz-transform:rotate(-320deg);opacity:0} | ||
+ | } | ||
+ | @-moz-keyframes spinoffPulse{0{-moz-transform:rotate(0)} | ||
+ | 100%{-moz-transform:rotate(360deg)} | ||
+ | } | ||
+ | @-webkit-keyframes spinPulse{0{-webkit-transform:rotate(160deg);opacity:0;box-shadow:0 0 1px #187BD8} | ||
+ | 50%{-webkit-transform:rotate(145deg);opacity:1} | ||
+ | 100%{-webkit-transform:rotate(-320deg);opacity:0} | ||
+ | } | ||
+ | @-webkit-keyframes spinoffPulse{0{-webkit-transform:rotate(0)} | ||
+ | 100%{-webkit-transform:rotate(360deg)} | ||
+ | } | ||
+ | @-o-keyframes spinPulse{0{-o-transform:rotate(160deg);opacity:0;box-shadow:0 0 1px #187BD8} | ||
+ | 50%{-o-transform:rotate(145deg);opacity:1} | ||
+ | 100%{-o-transform:rotate(-320deg);opacity:0} | ||
+ | } | ||
+ | @-o-keyframes spinoffPulse{0{-o-transform:rotate(0)} | ||
+ | 100%{-o-transform:rotate(360deg)} | ||
+ | } | ||
+ | @keyframes spinPulse{0{transform:rotate(160deg);opacity:0;box-shadow:0 0 1px #187BD8} | ||
+ | 50%{transform:rotate(145deg);opacity:1} | ||
+ | 100%{transform:rotate(-320deg);opacity:0} | ||
+ | } | ||
+ | @keyframes spinoffPulse{0{transform:rotate(0)} | ||
+ | 100%{transform:rotate(360deg)} | ||
+ | } | ||
+ | |||
/* mod */ | /* mod */ | ||
Line 224: | Line 257: | ||
</main> | </main> | ||
<footer> </footer> | <footer> </footer> | ||
+ | <div class='dt-loading'> <div class='laying'></div> <div class='layout'></div> </div> | ||
<!-- 理论上应用 2.1.4 版本的 jQuery,但是iGEM官方提供 1.11.1 --> | <!-- 理论上应用 2.1.4 版本的 jQuery,但是iGEM官方提供 1.11.1 --> | ||
<!-- jQuery 2.1.4 --> | <!-- jQuery 2.1.4 --> | ||
Line 234: | Line 268: | ||
$(".button-collapse").sideNav(); | $(".button-collapse").sideNav(); | ||
// Initialize collapsible (uncomment the line below if you use the dropdown variation) | // Initialize collapsible (uncomment the line below if you use the dropdown variation) | ||
− | + | $('.collapsible').collapsible(); | |
+ | // Loading动画 | ||
+ | $(".dt-loading").fadeOut('slow'); | ||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 13:36, 8 October 2016
Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg
Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz. Abcdefg hijklmnop qrs tuv wx yz.
-
filter_dramaFirst
Lorem ipsum dolor sit amet.
-
placeSecond
Lorem ipsum dolor sit amet.
-
whatshotThird
Lorem ipsum dolor sit amet.
-
filter_dramaFirst
Lorem ipsum dolor sit amet.
-
placeSecond
Lorem ipsum dolor sit amet.
-
whatshotThird
Lorem ipsum dolor sit amet.
-
filter_dramaFirst
Lorem ipsum dolor sit amet.
-
placeSecond
Lorem ipsum dolor sit amet.
-
whatshotThird
Lorem ipsum dolor sit amet.