Difference between revisions of "Team:NAIT Edmonton/Trial2"
(20 intermediate revisions by the same user not shown) | |||
Line 23: | Line 23: | ||
<div class="header_content"> | <div class="header_content"> | ||
− | <div class="logo"><a href="https://2015.igem.org/Team:NAIT_Edmonton"><img src="https://static.igem.org/mediawiki/2015/4/4a/NAIT_Logo_joy.png" width=" | + | <div class="logo"><a href="https://2015.igem.org/Team:NAIT_Edmonton"><img src="https://static.igem.org/mediawiki/2015/4/4a/NAIT_Logo_joy.png" width="141" height="140"></a></div> |
<div class="menu"> | <div class="menu"> | ||
Line 73: | Line 73: | ||
@charset "UTF-8"; | @charset "UTF-8"; | ||
− | #banner { width: 100%; height: 650px; background:transparent; overflow: hidden; position: relative; } | + | #banner {margin:0; width: 100%; height: 650px; background:transparent; overflow: hidden; position: relative; } |
#banner_img { display: block; position: relative; } | #banner_img { display: block; position: relative; } | ||
#banner_img li { position: absolute; top: 0; left: 0; width: 100%; height: 650px; background-position: center; background-size: cover; display: none; } | #banner_img li { position: absolute; top: 0; left: 0; width: 100%; height: 650px; background-position: center; background-size: cover; display: none; } | ||
Line 90: | Line 90: | ||
#banner_img .ad_img {position: absolute; right: 200px; top: 80px; width: 506px; height: 404px; } | #banner_img .ad_img {position: absolute; right: 200px; top: 80px; width: 506px; height: 404px; } | ||
#banner_img .ad_txt {position: absolute; right: 25%; left:25%; top: 170px; color: #fff; text-shadow: 1px 1px rgba(51,51,51,0.3); } | #banner_img .ad_txt {position: absolute; right: 25%; left:25%; top: 170px; color: #fff; text-shadow: 1px 1px rgba(51,51,51,0.3); } | ||
− | #banner_img .ad_txt h2 {color:#FFFFFF; } | + | #banner_img .ad_txt h2 {color:#FFFFFF;} |
#banner_img .ad_txt a {float:center;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;background-color:#8BC5EB; color:#fff; font-size:14px; padding:8px 12px; margin:20px 0 0 0; display:inline-block; } | #banner_img .ad_txt a {float:center;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;background-color:#8BC5EB; color:#fff; font-size:14px; padding:8px 12px; margin:20px 0 0 0; display:inline-block; } | ||
#banner_ctr { position: absolute; width: 500px; height: 50px; margin-left: -480px; left: 50%; bottom: 40px; z-index: 4; } | #banner_ctr { position: absolute; width: 500px; height: 50px; margin-left: -480px; left: 50%; bottom: 40px; z-index: 4; } | ||
− | #banner_ctr ul {width: 940px; height: 10px; background: # | + | #banner_ctr ul {width: 940px; height: 10px; background: url(https://static.igem.org/mediawiki/2015/5/5a/NAIT_Bar_Example.png) no-repeat; font-size: 0; line-height: 0; position: absolute; top: 20px; left: 10px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;} |
+ | #banner_bg {width: 940px; height: 10px; background: #FFFFFF; font-size: 0; line-height: 0; position: absolute; top: 20px; left: 10px;z-index:-5;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;} | ||
#banner_ctr li { display: block; float: left; width: 115px; height: 25px; cursor: pointer; } | #banner_ctr li { display: block; float: left; width: 115px; height: 25px; cursor: pointer; } | ||
#banner_ctr li.first-item {background: none; width: 20px; -webkit-border-radius: 20px 0 0 20px; -moz-border-radius: 20px 0 0 20px; border-radius: 20px 0 0 20px; cursor: default; } | #banner_ctr li.first-item {background: none; width: 20px; -webkit-border-radius: 20px 0 0 20px; -moz-border-radius: 20px 0 0 20px; border-radius: 20px 0 0 20px; cursor: default; } | ||
#banner_ctr li.last-item { background: none; width: 20px; -webkit-border-radius: 0 20px 20px 0; -moz-border-radius: 0 20px 20px 0; border-radius: 0 20px 20px 0; cursor: default; } | #banner_ctr li.last-item { background: none; width: 20px; -webkit-border-radius: 0 20px 20px 0; -moz-border-radius: 0 20px 20px 0; border-radius: 0 20px 20px 0; cursor: default; } | ||
− | #drag_ctr { position: absolute; top: 20px; left: 20px; width: 115px; height: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; bottom: 170px; background: # | + | #drag_ctr { position: absolute; top: 20px; left: 20px; width: 115px; height: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; bottom: 170px; background: #0D4D8C; z-index:0} |
#drag_arrow {position: absolute; top: 20px; left: 20px; width: 50px; height: 50px; background: none center 14px no-repeat; } | #drag_arrow {position: absolute; top: 20px; left: 20px; width: 50px; height: 50px; background: none center 14px no-repeat; } | ||
Line 106: | Line 107: | ||
<head> | <head> | ||
− | <script src="https:// | + | <script src="https://2015.igem.org/Team:NAIT_Edmonton/jquery.plugin.min.js?action=raw&ctype=text/javascript"></script> |
− | <script src="https:// | + | <script src="https://2015.igem.org/Team:NAIT_Edmonton/jquery-1.9.1.min.js?action=raw&ctype=text/javascript"></script> |
</head> | </head> | ||
Line 114: | Line 115: | ||
<center> | <center> | ||
− | + | ||
<div id="banner"> | <div id="banner"> | ||
Line 123: | Line 124: | ||
<div class="wrapper"> | <div class="wrapper"> | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
− | <h2 style="color:white;font-size: | + | <h2 style="color:white;font-size:60px;text-shadow:#000000 2px">Home</h2> |
<p> | <p> | ||
</p> | </p> | ||
Line 134: | Line 135: | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
<h2 style="color:#FFFFFF">Etc Etc.</h2> | <h2 style="color:#FFFFFF">Etc Etc.</h2> | ||
− | < | + | <h2>Something something |
− | </ | + | </h2> |
<a href="" target="_blank">read more</a> | <a href="" target="_blank">read more</a> | ||
− | |||
− | |||
− | |||
</div> | </div> | ||
</div> | </div> | ||
Line 155: | Line 153: | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
<h2 style="color:#FFFFFF">Example</h2> | <h2 style="color:#FFFFFF">Example</h2> | ||
− | < | + | <h2> |
This and<br /> | This and<br /> | ||
that<br /> | that<br /> | ||
and this. | and this. | ||
− | </ | + | </h2> |
<a href="" target="_blank">read more</a> | <a href="" target="_blank">read more</a> | ||
</div> | </div> | ||
Line 168: | Line 166: | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
<h2 style="color:#FFFFFF">Something Something</h2> | <h2 style="color:#FFFFFF">Something Something</h2> | ||
− | < | + | <h2> |
LALALALALALALALALALALALALALALLAALLAALLA. WRITE WHATEVER DESCRIPTION THE PHOTOGRAPH NEEDS HERE | LALALALALALALALALALALALALALALLAALLAALLA. WRITE WHATEVER DESCRIPTION THE PHOTOGRAPH NEEDS HERE | ||
− | </ | + | </h2> |
<a href="" target="_blank">read more</a> | <a href="" target="_blank">read more</a> | ||
</div> | </div> | ||
Line 179: | Line 177: | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
<h2 style="color:#FFFFFF">Such and Such</h2> | <h2 style="color:#FFFFFF">Such and Such</h2> | ||
− | < | + | <h2> |
Text | Text | ||
− | </ | + | </h2> |
<a href="" target="_blank">read more</a> | <a href="" target="_blank">read more</a> | ||
</div> | </div> | ||
Line 190: | Line 188: | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
<h2 style="color:#FFFFFF">So and So</h2> | <h2 style="color:#FFFFFF">So and So</h2> | ||
− | < | + | <h3> |
Description here | Description here | ||
− | </ | + | </h3> |
<a href="" target="_blank">read more</a> | <a href="" target="_blank">read more</a> | ||
</div> | </div> | ||
Line 201: | Line 199: | ||
<div class="ad_txt"> | <div class="ad_txt"> | ||
<h2 style="color:#FFFFFF">Sorry for Pandas</h2> | <h2 style="color:#FFFFFF">Sorry for Pandas</h2> | ||
− | < | + | <h3> |
I really do like pandas a lot. | I really do like pandas a lot. | ||
− | </ | + | </h3> |
<a href="" target="_blank">read more</a> | <a href="" target="_blank">read more</a> | ||
</div> | </div> | ||
Line 212: | Line 210: | ||
<div id="drag_ctr"></div> | <div id="drag_ctr"></div> | ||
<ul> | <ul> | ||
− | <li class="first-item"> | + | <li class="first-item">NAIT</li> |
<li>1</li> | <li>1</li> | ||
<li>2</li> | <li>2</li> | ||
Line 224: | Line 222: | ||
</ul> | </ul> | ||
<div id="drag_arrow"></div> | <div id="drag_arrow"></div> | ||
+ | <div id="banner_bg"></div> | ||
</div> | </div> | ||
</div> | </div> | ||
− | <script src="https:// | + | <script src="https://2015.igem.org/Team:NAIT_Edmonton/fashionfoucs.js?action=raw&ctype=text/javascript"></script> |
<!-- End --> | <!-- End --> | ||
Latest revision as of 00:39, 17 July 2015