Team:Heidelberg/DesignTest

From 2013.igem.org

(Difference between revisions)
m
Line 3: Line 3:
{{:Team:Heidelberg/Templates/Gelpicture|9em|wiki/images/f/ff/IGem_Team_Heidelberg_Logo.gif|bli|bla|blub}}
{{:Team:Heidelberg/Templates/Gelpicture|9em|wiki/images/f/ff/IGem_Team_Heidelberg_Logo.gif|bli|bla|blub}}
<html>
<html>
-
<!--
 
-
<!-- Beginning of Sliders -->
 
-
<!-- Beginning of Slider 1 -->
 
-
 
-
<script>
 
-
(function() {
 
-
 
-
  // store the slider in a local variable
 
-
  var $window = $(window),
 
-
      flexslider;
 
-
 
-
  // tiny helper function to add breakpoints
 
-
  function getGridSize() {
 
-
    return (window.innerWidth < 600) ? 2 :
 
-
          (window.innerWidth < 900) ? 3 : 4;
 
-
  }
 
-
 
-
  $(function() {
 
-
    SyntaxHighlighter.all();
 
-
  });
 
-
 
-
  $window.load(function() {
 
-
    $('.flexslider').flexslider({
 
-
      animation: "slide",
 
-
      animationLoop: false,
 
-
      itemWidth: 210,
 
-
      itemMargin: 5,
 
-
      minItems: getGridSize(), // use function to pull in initial value
 
-
      maxItems: getGridSize() // use function to pull in initial value
 
-
    });
 
-
  });
 
-
 
-
  // check grid size on resize event
 
-
  $window.resize(function() {
 
-
    var gridSize = getGridSize();
 
-
 
-
    flexslider.vars.minItems = gridSize;
 
-
    flexslider.vars.maxItems = gridSize;
 
-
  });
 
-
}());
 
-
</script>
 
-
 
-
<div id="SliderWrap">
 
-
<div id="SliderPrev"><a href="#" onclick="sliderMain.goToPrev();return(false);">&#x25C0;</a></div><!--
 
-
--><div id="Slider" onmouseover="clearTimeout(sliderMain.Interval)" onmouseout="sliderMain.clock()">
 
-
 
-
<ul id="SliderUl">
 
-
 
-
<li>
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2013/1/13/Heidelberg_Team_Group.JPG" alt="Group Picture"><h2>Our Team</h2>
 
-
</div>
 
-
</li>
 
-
<li>
 
-
<div>
 
-
<h2>We did lot's  of funny stuff</h2>
 
-
</div>
 
-
</li>
 
-
<li>
 
-
<div>
 
-
<h2>And we want to thank all our sponsors!</h2>
 
-
</div>
 
-
</li>
 
-
 
-
</ul>
 
-
 
-
</div><!--
 
-
--><div id="SliderNext"><a href="#" onclick="sliderMain.goToNext();return(false);">&nbsp;</a></div>
 
-
</div>
 
-
<script>
 
-
var sliderMain = new Slider(document.getElementById("Slider"));
 
-
</script>
 
-
<style>
 
-
#SliderWrap {
 
-
min-width:80%;
 
-
}
 
-
#Slider, #SliderNext, #SliderPrev {
 
-
display:inline-block;
 
-
vertical-align:middle;
 
-
overflow:hidden;
 
-
}
 
-
#SliderNext a, #SliderPrev a {
 
-
text-decoration:none;
 
-
display:block;
 
-
width:100%;
 
-
font-weight:bold;
 
-
font-size:150%;
 
-
}
 
-
#SliderNext, #SliderPrev {
 
-
width:1.5em;
 
-
text-align:center;
 
-
position:relative;
 
-
}
 
-
#SliderNext {
 
-
border-top-left-radius:1em;
 
-
border-bottom-left-radius:1em;
 
-
left:-1.5em;
 
-
height:2em;
 
-
z-index:3;
 
-
}
 
-
#SliderNext a {
 
-
height:100%;
 
-
background-image:url(https://static.igem.org/mediawiki/2013/d/da/Heidelberg_slider_Arrrow_next.png);
 
-
background-position:0% 100%;
 
-
background-size: 130% auto;
 
-
}
 
-
#SliderNext a:hover {
 
-
background-position:0% 0%;
 
-
}
 
-
#SliderPrev {
 
-
border-top-right-radius:1em;
 
-
border-bottom-right-radius:1em;
 
-
left:1.3em;
 
-
z-index:2;
 
-
border-left:1px solid #555;
 
-
box-shadow:0px 1px 2px 1px #555
 
-
}
 
-
#SliderPrev a {
 
-
background-color:#FFCC44;
 
-
color:#888;
 
-
line-height:1.5em;
 
-
}
 
-
#SliderPrev a:hover {
 
-
background-color:#FFCC00;
 
-
color:#292929;
 
-
}
 
-
#Slider {
 
-
width:60em;
 
-
height:20em;
 
-
display:auto;
 
-
border:1px solid #292929;
 
-
border-radius:0.5em;
 
-
background-color:#DDD;
 
-
box-shadow:0px 2px 4px 5px #909090;
 
-
z-index:1;
 
-
margin:1.5em 0em;
 
-
}
 
-
#SliderUl {
 
-
list-style:none;
 
-
position:relative;
 
-
margin:0px;
 
-
padding:0px;
 
-
-webkit-transition: 0.5s left;
 
-
-moz-transition: 0.5s left;
 
-
-ms-transition: 0.5s left;
 
-
-o-transition: 0.5s left;
 
-
}
 
-
#SliderUl li {
 
-
float:left;
 
-
width:60em;
 
-
height:20em;
 
-
}
 
-
#SliderUl img, #SliderUl div {
 
-
width:100%;
 
-
}
 
-
</style>
 
-
 
-
<!-- End of Slider 1 -->
 
-
 
-
<!-- Beginning of Slider 2 -->
 
-
 
-
<script>
 
-
var Slider2 = function() {this.initialize.apply(this, arguments)}
 
-
Slider2.prototype = {
 
-
 
-
initialize: function(slider) {
 
-
this.ul = slider.children[0]
 
-
this.li = this.ul.children
 
-
 
-
// make <ul> as large as all <li>’s
 
-
this.ul.style.width = (this.li[0].clientWidth * this.li.length) + 'px'
 
-
 
-
this.currentIndex = 0
 
-
this.clock()
 
-
},
 
-
goTo: function(index) {
 
-
clearTimeout(this.Interval)
 
-
// circle through indices
 
-
if (index < 0)
 
-
index = this.li.length - 1
 
-
else if (index > this.li.length - 1) {
 
-
this.ul.style.left = "20em";
 
-
this.clock();
 
-
this.currentIndex = 0;
 
-
return;
 
-
}
 
-
 
-
// move <ul> left
 
-
this.ul.style.left = '-' + ((40 * index)-20) + 'em'
 
-
this.clock()
 
-
this.currentIndex = index
 
-
},
 
-
goToPrev: function() {
 
-
this.goTo(this.currentIndex - 1)
 
-
},
 
-
goToNext: function() {
 
-
this.goTo(this.currentIndex + 1)
 
-
},
 
-
clock: function() {
 
-
var self = this;
 
-
this.Interval = setInterval(function() {self.goToNext()}, 2500);
 
-
}
 
-
}
 
-
</script>
 
-
 
-
<div id="Slider2Wrap">
 
-
<div id="SliderPrev2"><a href="#" onclick="sliderMain2.goToPrev();return(false);">&#x25C0;</a></div><!--
 
-
--><div id="Slider2" onmouseover="clearTimeout(sliderMain2.Interval)" onmouseout="sliderMain2.clock()">
 
-
 
-
<ul id="SliderUl2">
 
-
 
-
<li>
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2013/1/13/Heidelberg_Team_Group.JPG" alt="Group Picture">
 
-
<p id="slide-title2" style="top: -5em;">
 
-
<br>
 
-
OUR TEAM
 
-
</p>
 
-
</div>
 
-
</li>
 
-
<li>
 
-
<div>
 
-
<img src="" alt="Gold">
 
-
<p id="slide-title2" style="top: -8.5em;">
 
-
 
-
CHECK OUT HOW WE RECYCLED GOLD!
 
-
</p>
 
-
</div>
 
-
</li>
 
-
<li>
 
-
<div>
 
-
<img src="" alt="Bacillus Subtilis">
 
-
<p id="slide-title2" style="top: -5em;">
 
-
 
-
GET TO NOW MORE ABOUT OUR BACTERIA
 
-
</p>
 
-
 
-
 
-
</div>
 
-
</li>
 
-
 
-
</ul>
 
-
<div id="Sliderleft"></div>
 
-
<div id="Sliderright"></div>
 
-
</div><!--
 
-
--><div id="SliderNext2"><a href="#" onclick="sliderMain2.goToNext();return(false);">&nbsp;</a></div>
 
-
</div>
 
-
<script>
 
-
var sliderMain2 = new Slider2(document.getElementById("Slider2"));
 
-
</script>
 
-
<style>
 
-
#Sliderleft, #Sliderright {
 
-
width:20em;
 
-
height:26em;
 
-
position:relative;
 
-
top:-26em;
 
-
background-color:rgba(100,100,100,0.5)
 
-
}
 
-
#Sliderleft { float:left; }
 
-
#Sliderright { float:right; }
 
-
#Slider2Wrap {
 
-
min-width:80%;
 
-
}
 
-
#Slider2, #SliderNext2, #SliderPrev2 {
 
-
display:inline-block;
 
-
vertical-align:middle;
 
-
overflow:hidden;
 
-
}
 
-
#SliderNext2 a, #SliderPrev2 a {
 
-
text-decoration:none;
 
-
display:block;
 
-
width:100%;
 
-
font-weight:bold;
 
-
font-size:150%;
 
-
}
 
-
#SliderNext2, #SliderPrev2 {
 
-
width:1.5em;
 
-
text-align:center;
 
-
position:relative;
 
-
}
 
-
#SliderNext2 {
 
-
border-top-left-radius:1em;
 
-
border-bottom-left-radius:1em;
 
-
left:-1.5em;
 
-
height:2em;
 
-
z-index:3;
 
-
}
 
-
#SliderNext2 a {
 
-
height:100%;
 
-
background-image:url(https://static.igem.org/mediawiki/2013/d/da/Heidelberg_slider_Arrrow_next.png);
 
-
background-position:0% 100%;
 
-
background-size: 130% auto;
 
-
}
 
-
#SliderNext2 a:hover {
 
-
background-position:0% 0%;
 
-
}
 
-
#SliderPrev2 {
 
-
border-top-right-radius:1em;
 
-
border-bottom-right-radius:1em;
 
-
left:1.3em;
 
-
z-index:2;
 
-
border-left:1px solid #555;
 
-
box-shadow:0px 1px 2px 1px #555
 
-
}
 
-
#SliderPrev2 a {
 
-
background-color:#FFCC44;
 
-
color:#888;
 
-
line-height:1.5em;
 
-
}
 
-
#SliderPrev2 a:hover {
 
-
background-color:#FFCC00;
 
-
color:#292929;
 
-
}
 
-
#Slider2 {
 
-
width:80em;
 
-
height:26em;
 
-
display:auto;
 
-
border:1px solid #292929;
 
-
border-radius:0.5em;
 
-
background-color:#DDD;
 
-
box-shadow:0px 2px 4px 5px #909090;
 
-
z-index:1;
 
-
margin:1.5em 0em;
 
-
}
 
-
#SliderUl2 {
 
-
list-style:none;
 
-
position:relative;
 
-
left:10em;
 
-
margin:0px;
 
-
padding:0px;
 
-
-webkit-transition: 0.5s left;
 
-
-moz-transition: 0.5s left;
 
-
-ms-transition: 0.5s left;
 
-
-o-transition: 0.5s left;
 
-
}
 
-
#SliderUl2 li {
 
-
float:left;
 
-
width:40em;
 
-
height:26em;
 
-
}
 
-
#SliderUl2 img, #SliderUl2 div {
 
-
width:100%;
 
-
}
 
-
#slide-title2{
 
-
position: relative;
 
-
background-color: rgba(41,41,41,0.8);
 
-
color: #ffcc00;
 
-
width: 40%;
 
-
align: right;
 
-
}
 
-
</style>
 
-
 
-
<!-- End of Slider 2 -->
 
-
 
-
<!-- End of Sliders -->
 
-
-->
 
Find all templates used on <a href="https://2013.igem.org/Team:Heidelberg/Templates">the templates page</a> with coresponding explanations.<br />
Find all templates used on <a href="https://2013.igem.org/Team:Heidelberg/Templates">the templates page</a> with coresponding explanations.<br />

Revision as of 12:17, 7 September 2013

PHILOSOPHER'S STONE

igem-2013

bli
bla
additional: blub

Find all templates used on the templates page with coresponding explanations.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Philosophers Stone

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Philosophers Stone
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING
THIS COULD BE YOUR HEADING

Retrieved from "http://2013.igem.org/Team:Heidelberg/DesignTest"