|
|
Line 11: |
Line 11: |
| <script src="https://2017.igem.org/Template:UNC-Asheville/BootstrapJS"></script> | | <script src="https://2017.igem.org/Template:UNC-Asheville/BootstrapJS"></script> |
| --> | | --> |
− | <style> | + | <style type='text/css'> |
− | .bg {
| + | #top_title, |
− | background: url('https://static.igem.org/mediawiki/2017/6/64/UNC-Asheville-SadDogo.jpg') no-repeat center center; | + | #sideMenu { |
− | position: fixed; | + | display: none !important; |
− | width: 100%; | + | } |
− | height: 550px; /*same height as jumbotron */
| + | |
− | top:0;
| + | #content { |
− | left:0; | + | width: 100%; |
− | z-index: -1; | + | margin: 0; |
− | }
| + | padding: 0; |
− | | + | background: #f3f4f4; |
− | .jumbotron {
| + | } |
| + | |
| + | .cv { |
| + | box-shadow: 100px 0px 0 0px #fe4365; |
| + | } |
| + | |
| + | .this_border { |
| + | background-color: #fe4365; |
| + | } |
| + | .jumbotron { |
| height: 550px; | | height: 550px; |
| color: white; | | color: white; |
| text-shadow: #444 0 1px 1px; | | text-shadow: #444 0 1px 1px; |
− | background:transparent; | + | background:#00ff00 url('https://static.igem.org/mediawiki/2017/6/64/UNC-Asheville-SadDogo.jpg') center center |
| } | | } |
| + | body{ |
| + | background:#00ff00 url('https://static.igem.org/mediawiki/2017/6/64/UNC-Asheville-SadDogo.jpg') center center |
| | | |
| + | } |
| | | |
− | .location-name, .building-name {
| |
− | text-align: center;
| |
− | color:black;
| |
− | font-size: 60px;
| |
− | text-shadow: 2px 2px black;
| |
− | }
| |
| | | |
| | | |
− | .menu-links {
| |
− | display: block;
| |
− | text-align: center;
| |
− | }
| |
− |
| |
− | </style>
| |
| | | |
| + | </style> |
| </head> | | </head> |
− | <body>
| |
− | <nav class="navbar navbar-default" role="navigation">
| |
− | <div class="container-fluid">
| |
− | <!-- Brand and toggle get grouped for better mobile display -->
| |
− | <div class="navbar-header">
| |
− | <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
| |
− | <span class="sr-only">Toggle navigation</span>
| |
− | <span class="icon-bar"></span>
| |
− | <span class="icon-bar"></span>
| |
− | <span class="icon-bar"></span>
| |
− | </button>
| |
− | <a class="navbar-brand" href="#">ATG</a>
| |
− | </div>
| |
| | | |
− | <!-- Collect the nav links, forms, and other content for toggling -->
| |
− | <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
| |
− | <ul class="nav navbar-nav">
| |
− | <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
| |
− | <li><a href="#">Link</a></li>
| |
− | <li class="dropdown">
| |
− | <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
| |
− | <ul class="dropdown-menu" role="menu">
| |
− | <li><a href="#">Action</a></li>
| |
− | <li><a href="#">Another action</a></li>
| |
− | <li><a href="#">Something else here</a></li>
| |
− | <li class="divider"></li>
| |
− | <li><a href="#">Separated link</a></li>
| |
− | <li class="divider"></li>
| |
− | <li><a href="#">One more separated link</a></li>
| |
− | </ul>
| |
− | </li>
| |
− | </ul>
| |
− | <form class="navbar-form navbar-left" role="search">
| |
− | <div class="form-group">
| |
− | <input type="text" class="form-control" placeholder="Search">
| |
− | </div>
| |
− | <button type="submit" class="btn btn-default">Submit</button>
| |
− | </form>
| |
− | <ul class="nav navbar-nav navbar-right">
| |
− | <li><a href="#">Link</a></li>
| |
− | <li class="dropdown">
| |
− | <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
| |
− | <ul class="dropdown-menu" role="menu">
| |
− | <li><a href="#">Action</a></li>
| |
− | <li><a href="#">Another action</a></li>
| |
− | <li><a href="#">Something else here</a></li>
| |
− | <li class="divider"></li>
| |
− | <li><a href="#">Separated link</a></li>
| |
− | </ul>
| |
− | </li>
| |
− | </ul>
| |
− | </div><!-- /.navbar-collapse -->
| |
− | </div><!-- /.container-fluid -->
| |
− | </nav>
| |
| | | |
− | <div class="bg"></div> | + | <html> |
| + | |
| <div class="jumbotron"> | | <div class="jumbotron"> |
− | <p class="location-name"> T C E a s y</p>
| + | <div class="container center"> |
− | <p class="building-name">ECE Engineering Building</p>
| + | <h1>Workin' on it homie.</h1> |
− | <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Online Editing</a></div>
| + | </div> |
− | <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Building FCA Query</a></div>
| + | |
− | <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Chart FCA Query</a></div>
| + | |
− | <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Facility Document Management CP</a></div>
| + | |
− | <div class="menu-links"><a href="#" class="btn btn-primary btn-large">Facility Document Management Query</a></div>
| + | |
| </div> | | </div> |
− |
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <h2>Page Content</h2>
| |
− | blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
| |
− | blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
| |
− | </div>
| |
− | <hr>
| |
− | <div class="row">
| |
− | <h2>Page Content</h2>
| |
− | blah blah blah blah blah blah blah blah blah blah blah
| |
− | blah blah blah blah blah blah blah blah blah blah blah
| |
− | blah blah blah blah blah blah blah blah blah blah blah
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | <hr>
| |
− |
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-md-12 text-center"><p>The End.</p></div>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | <script>
| |
− | // sandbox disable popups
| |
− | if (window.self !== window.top && window.name!="view1") {;
| |
− | window.alert = function(){/*disable alert*/};
| |
− | window.confirm = function(){/*disable confirm*/};
| |
− | window.prompt = function(){/*disable prompt*/};
| |
− | window.open = function(){/*disable open*/};
| |
− | }
| |
− |
| |
− | // prevent href=# click jump
| |
− | document.addEventListener("DOMContentLoaded", function() {
| |
− | var links = document.getElementsByTagName("A");
| |
− | for(var i=0; i < links.length; i++) {
| |
− | if(links[i].href.indexOf('#')!=-1) {
| |
− | links[i].addEventListener("click", function(e) {
| |
− | console.debug("prevent href=# click");
| |
− | if (this.hash) {
| |
− | if (this.hash=="#") {
| |
− | e.preventDefault();
| |
− | return false;
| |
− | }
| |
− | else {
| |
− | /*
| |
− | var el = document.getElementById(this.hash.replace(/#/, ""));
| |
− | if (el) {
| |
− | el.scrollIntoView(true);
| |
− | }
| |
− | */
| |
− | }
| |
− | }
| |
− | return false;
| |
− | })
| |
− | }
| |
− | }
| |
− | }, false);
| |
− |
| |
− | </script>
| |
− |
| |
− | <!--scripts loaded here-->
| |
− |
| |
− | <script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
| |
− | <script src="//cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.min.js"></script>
| |
− | <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
| |
− |
| |
− |
| |
− | <script src="https://rawgit.com/bassjobsen/affix/master/assets/js/affix.js"></script>
| |
− |
| |
− | <script>
| |
− | $('.navbar').affix({
| |
− | offset:{
| |
− | top: $('#header').outerHeight(),
| |
− | bottom: $('#header').outerHeight() - 200
| |
− | }
| |
− | });
| |
− |
| |
− | $('#sidemenu').affix({
| |
− | offset:{
| |
− | top: $('#header').outerHeight() - 20,
| |
− | bottom: $('footer').outerHeight() + 50
| |
− | }
| |
− | });
| |
− |
| |
− | </script>
| |
− |
| |
− | <script>
| |
− | var jumboHeight = $('.jumbotron').outerHeight();
| |
− | function parallax(){
| |
− | var scrolled = $(window).scrollTop();
| |
− | $('.bg').css('height', (jumboHeight-scrolled) + 'px');
| |
− | }
| |
− |
| |
− | $(window).scroll(function(e){
| |
− | parallax();
| |
− | });
| |
− | </script>
| |
− |
| |
− | </body>
| |
− | </html>
| |
− |
| |
− |
| |
| | | |
| | | |
| </html> | | </html> |