Team:Waterloo/p1

From 2013.igem.org

(Difference between revisions)
 
(2 intermediate revisions not shown)
Line 4: Line 4:
/*hide default igem banner and reformat style into blank slate*/
/*hide default igem banner and reformat style into blank slate*/
#globalWrapper {width: 100%;}
#globalWrapper {width: 100%;}
-
#top-section {width: 100%; height:30px; border:none;}
+
#top-section {width: 100%; height:0px; border:none;}
#p-logo {display:none;}
#p-logo {display:none;}
#search-controls {display:none;}
#search-controls {display:none;}
#menubar a {color:#000000;}
#menubar a {color:#000000;}
-
#menubar a:hover{text-decoration:none; color:#52749C;}
+
#menubar a:hover{text-decoration:none; color:#5f00d5;}
-
.left-menu {background-color:#FFFFFF; margin:0px 0px 0px 0px; padding:0;}
+
.left-menu {background-color:; margin:0px 0px 0px 25px; padding:0;}
-
.left-menu ul {background-color:#FFFFFF; margin:0; padding:0;}
+
.left-menu ul {background-color:#b99cdc; margin:0; padding:0;}
-
.right-menu ul li a {background-color:#FFFFFF;}
+
.right-menu ul li a {background-color:#b99cdc;}
.printfooter {display:none;}
.printfooter {display:none;}
#footer-box {border:none;}
#footer-box {border:none;}
Line 161: Line 161:
/* change bg colour */
/* change bg colour */
#content {
#content {
-
background: url(http://commentnation.com/hotlinks/gray_and_white_diagonal_stripes_background_seamless.gif);
+
background: url(https://static.igem.org/mediawiki/2013/b/b8/Gray_and_white_diagonal_stripes_background_seamless.jpeg);
width: auto;
width: auto;
}
}
Line 272: Line 272:
.intro_box h3 {
.intro_box h3 {
-
background: #000000;
+
background: #202020;
padding: 3px 10px;
padding: 3px 10px;
margin: 0 0 10px 0;
margin: 0 0 10px 0;
Line 280: Line 280:
.intro_box img {
.intro_box img {
-
width: 272px;
+
width: 276px;
height: 168px;
height: 168px;
-
border: 5px solid #e6e0ce;
+
border: 3px solid #202020;
         margin-bottom: 10px;
         margin-bottom: 10px;
}
}
Line 340: Line 340:
position: relative;
position: relative;
/*border: 0px solid #fff;*/
/*border: 0px solid #fff;*/
-
width: 650px;
+
width: 800px;
}
}
/*--Image Rotator Window/Masking Styles--*/
/*--Image Rotator Window/Masking Styles--*/
.window {
.window {
-
height:400px;
+
height:350px;
-
width: 650px;
+
width: 800px;
overflow: hidden; /*--Hides anything outside of the set width/height--*/
overflow: hidden; /*--Hides anything outside of the set width/height--*/
position: relative;
position: relative;
Line 361: Line 361:
width: 400px; height:47px; /*--Increase this width when adding more numbers in paging--*/
width: 400px; height:47px; /*--Increase this width when adding more numbers in paging--*/
z-index: 100; /*--Assures the paging stays on the top layer--*/
z-index: 100; /*--Assures the paging stays on the top layer--*/
-
text-align: center;
+
text-align: right;
-
line-height: 110px;
+
padding-right: 30px;
 +
line-height: 65px;
display: none; /*--Hidden by default, will be later shown with jQuery--*/
display: none; /*--Hidden by default, will be later shown with jQuery--*/
}
}
.paging a {
.paging a {
-
padding: 5px;
+
background-color: #ffffff;
 +
border: 1px solid #ffffff;
 +
padding: 5px;
text-decoration: none;
text-decoration: none;
-
color: #000;
+
color: #202020;
}
}
.paging a.active {
.paging a.active {
font-weight: bold;
font-weight: bold;
-
/*background: #ffffff;*/
+
color: #ffffff;
-
border: 1px solid #ffffff;
+
background: #202020;
-
-moz-border-radius: 3px;
+
border: 1px solid #202020;
-
-khtml-border-radius: 3px;
+
-moz-border-radius: 0px;
-
-webkit-border-radius: 3px;
+
-khtml-border-radius: 0px;
 +
-webkit-border-radius: 0px;
}
}
.paging a:hover {font-weight: bold;}
.paging a:hover {font-weight: bold;}
Line 393: Line 397:
$(".paging a:first").addClass("active");
$(".paging a:first").addClass("active");
-
//Get size of images, how many there are, then determin the size of the image reel.
+
//Get size of images, how many there are, then determine the size of the image reel.
var imageWidth = $(".window").width();
var imageWidth = $(".window").width();
var imageSum = $(".image_reel img").size();
var imageSum = $(".image_reel img").size();
Line 412: Line 416:
$(".image_reel").animate({  
$(".image_reel").animate({  
left: -image_reelPosition
left: -image_reelPosition
-
}, 500 );
+
}, 1500 );
};  
};  
Line 424: Line 428:
}
}
rotate(); //Trigger the paging and slider function
rotate(); //Trigger the paging and slider function
-
}, 3500); //Timer speed in milliseconds  
+
}, 4000); //Timer speed in milliseconds  
};
};
Line 537: Line 541:
     <div class="window">
     <div class="window">
         <div class="image_reel">
         <div class="image_reel">
-
                     <img src="http://assets.inhabitat.com/wp-content/blogs.dir/1/files/2011/03/University-Waterloo-Engineering-5-2-537x295.jpg" style=" margin-right:0px; width:650px; height:400px" alt="" />
+
                    <img src="http://findoutmore.uwaterloo.ca/ict/images/uw/main.jpg" style=" margin-right:0px; width:800px; height:350px" alt="" />
-
                     <img src="http://images.dailytech.com/nimage/19635_M13_Virus.jpg" style=" margin-right:0px; width:650px; height:400px" alt="" />
+
                     <img src="http://assets.inhabitat.com/wp-content/blogs.dir/1/files/2011/03/University-Waterloo-Engineering-5-2-537x295.jpg" style=" margin-right:0px; width:800px; height:350px" alt="" />
-
                               
+
                     <img src="http://images.dailytech.com/nimage/19635_M13_Virus.jpg" style=" margin-right:0px; width:800px; height:350px" alt="" />
 +
 
         </div>
         </div>
     </div>
     </div>
Line 545: Line 550:
         <a href="#" rel="1">1</a>
         <a href="#" rel="1">1</a>
         <a href="#" rel="2">2</a>
         <a href="#" rel="2">2</a>
 +
        <a href="#" rel="3">3</a>
          
          
   
   

Latest revision as of 21:54, 19 May 2013