Team:TU-Delft/Team/General

From 2011.igem.org

(Difference between revisions)
 
(31 intermediate revisions not shown)
Line 2: Line 2:
__NOTOC__
__NOTOC__
<html>
<html>
 +
<script type='text/javascript' src='http://mycraft.gr/wp-content/plugins/mc-booklet/js/jquery.easing.1.3.js?ver=3.0.3'></script>
 +
<script src="http://tympanus.net/Tutorials/MoleskineNotebook/cufon/cufon-yui.js" type="text/javascript"></script>
 +
<script src="http://tympanus.net/Tutorials/MoleskineNotebook/cufon/ChunkFive_400.font.js" type="text/javascript"></script>
 +
<script src="http://tympanus.net/Tutorials/MoleskineNotebook/cufon/Note_this_400.font.js" type="text/javascript"></script>
 +
<script type='text/javascript' src='http://mycraft.gr/wp-content/plugins/mc-booklet/js/jquery.booklet.1.1.0.min.js?ver=3.0.3'></script>
 +
<script type="text/javascript">
 +
Cufon.replace('h1,p,.b-counter');
 +
Cufon.replace('.book_wrapper a', {hover:true});
 +
Cufon.replace('.title', {textShadow: '1px 1px #C59471', fontFamily:'ChunkFive'});
 +
Cufon.replace('.reference a', {textShadow: '1px 1px #C59471', fontFamily:'ChunkFive'});
 +
Cufon.replace('.loading', {textShadow: '1px 1px #000', fontFamily:'ChunkFive'});
 +
</script>
<div class="book_wrapper">
<div class="book_wrapper">
Line 10: Line 22:
<div id="mybook" style="display:none;">
<div id="mybook" style="display:none;">
-
<div class="b-load">
+
<div class="b-load">
-
<div>
+
 
-
<img src="http://tympanus.net/Tutorials/MoleskineNotebook/images/1.jpg" alt=""/>
+
<div>
-
<h1>Slider Gallery</h1>
+
<img src="http://tympanus.net/Tutorials/MoleskineNotebook/images/1.jpg" alt=""/>
-
<p>This tutorial is about creating a creative gallery with a
+
<h3>Week 24</h3>
-
slider for the thumbnails. The idea is to have an expanding
+
<p>What we did in week 24</p>
-
thumbnails area which opens once an album is chosen.
+
<a href="#" class="article">Article</a>
-
The thumbnails will scroll to the end and move back to
+
<a href="#" class="demo">Demo</a>
-
the first image. The user can scroll through the thumbnails
+
-
by using the slider controls. When a thumbnail is clicked,
+
-
it moves to the center and the full image preview opens.</p>
+
-
<a href="http://tympanus.net/codrops/2010/10/07/slider-gallery/" target="_blank" class="article">Article</a>
+
-
<a href="http://tympanus.net/Tutorials/SliderGallery/" target="_blank" class="demo">Demo</a>
+
-
</div>
+
-
+
-
</div>
+
</div>
</div>
 +
 +
<div>
 +
...
 +
</div>
 +
 +
</div>
 +
</div>
</div>
</div>
<style type="text/css">
<style type="text/css">
-
*{
 
-
margin:0;
 
-
padding:0;
 
-
}
 
-
 
-
h1{
 
-
color:#2F1B0C;
 
-
font-size:40px;
 
-
margin:20px 0px 0px 20px;
 
-
}
 
-
span.reference{
 
-
font-family:Arial;
 
-
display:block;
 
-
font-size:12px;
 
-
text-align:center;
 
-
margin-bottom:10px;
 
-
}
 
-
span.reference a{
 
-
color:#000;
 
-
text-transform:uppercase;
 
-
text-decoration:none;
 
-
margin:0px 20px;
 
-
}
 
-
span.reference a:hover{
 
-
color:#ddd;
 
-
}
 
-
/* Booklet jQuery Plugin Style*/
 
.booklet          {
.booklet          {
width:900px;
width:900px;
Line 71: Line 55:
}
}
.booklet .b-wrap-left  {
.booklet .b-wrap-left  {
-
background:#fff url(http://tympanus.net/Tutorials/MoleskineNotebook/images/left_bg.jpg) no-repeat top left;
+
background:#fff url(../images/left_bg.jpg) no-repeat top left;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
Line 80: Line 64:
}
}
.booklet .b-wrap-right {
.booklet .b-wrap-right {
-
background:#efefef url(http://tympanus.net/Tutorials/MoleskineNotebook/images/right_bg.jpg) no-repeat top left;
+
background:#efefef url(../images/right_bg.jpg) no-repeat top left;
-webkit-border-top-right-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
Line 108: Line 92:
margin:0 auto;
margin:0 auto;
padding-top:50px;
padding-top:50px;
-
width:905px;
+
width:1000px;
height:540px;
height:540px;
position:relative;
position:relative;
background:transparent url(http://tympanus.net/Tutorials/MoleskineNotebook/images/bg.png) no-repeat 9px 27px;
background:transparent url(http://tympanus.net/Tutorials/MoleskineNotebook/images/bg.png) no-repeat 9px 27px;
}
}
-
.book_wrapper h1{
+
.book_wrapper h3{
color:#13386a;
color:#13386a;
-
margin:5px 5px 5px 15px;
+
margin:5px 5px 5px 50px;
font-size:26px;
font-size:26px;
background:transparent url(http://tympanus.net/Tutorials/MoleskineNotebook/images/h1.png) no-repeat bottom left;
background:transparent url(http://tympanus.net/Tutorials/MoleskineNotebook/images/h1.png) no-repeat bottom left;
-
padding-bottom:7px;
+
width:1000px;
 +
padding-bottom:7px;
}
}
.book_wrapper p{
.book_wrapper p{
font-size:16px;
font-size:16px;
-
margin:5px 5px 5px 15px;
+
margin:5px 5px 5px 50px;
}
}
.book_wrapper a.article,
.book_wrapper a.article,
Line 147: Line 132:
}
}
.book_wrapper img{
.book_wrapper img{
-
margin:10px 0px 5px 35px;
+
margin:10px 0px 5px 50px;
width:300px;
width:300px;
padding:4px;
padding:4px;
Line 167: Line 152:
margin-top:-20px;
margin-top:-20px;
top:50%;
top:50%;
-
background:transparent url(http://tympanus.net/Tutorials/MoleskineNotebook/images/buttons.png) no-repeat 0px -40px;
+
background:transparent url(../images/buttons.png) no-repeat 0px -40px;
}
}
a#prev_page_button{
a#prev_page_button{
Line 193: Line 178:
padding-left:60px;
padding-left:60px;
font-size:15px;
font-size:15px;
-
background: #000 url(http://tympanus.net/Tutorials/MoleskineNotebook/images/ajax-loader.gif) no-repeat 10px 50%;
+
background: #000 url(../images/ajax-loader.gif) no-repeat 10px 50%;
opacity: 0.7;
opacity: 0.7;
z-index:9999;
z-index:9999;
Line 200: Line 185:
border-radius:20px;
border-radius:20px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
 +
}
</style>
</style>
Line 330: Line 316:
});
});
</script>
</script>
-
<script src="http://tympanus.net/Tutorials/MoleskineNotebook/cufon/cufon-yui.js" type="text/javascript"></script>
+
 
-
<script src="http://tympanus.net/Tutorials/MoleskineNotebook/cufon/ChunkFive_400.font.js" type="text/javascript"></script>
+
-
<script src="http://tympanus.net/Tutorials/MoleskineNotebook/cufon/Note_this_400.font.js" type="text/javascript"></script>
+
-
<script type="text/javascript">
+
-
Cufon.replace('h1,p,.b-counter');
+
-
Cufon.replace('.book_wrapper a', {hover:true});
+
-
Cufon.replace('.title', {textShadow: '1px 1px #C59471', fontFamily:'ChunkFive'});
+
-
Cufon.replace('.reference a', {textShadow: '1px 1px #C59471', fontFamily:'ChunkFive'});
+
-
Cufon.replace('.loading', {textShadow: '1px 1px #000', fontFamily:'ChunkFive'});
+
-
</script>
+
</html>
</html>
{{TU-footer}}
{{TU-footer}}

Latest revision as of 13:45, 16 June 2011



TUDelft Logo2 TUDelft Logo2 TUDelft Logo2 TUDelft Logo2 TUDelft Logo2 TUDelft Logo2

Loading pages...

Back to iGEM.org

Retrieved from "http://2011.igem.org/Team:TU-Delft/Team/General"