"
Team:Heidelberg/DesignTest
From 2013.igem.org
(Difference between revisions)
JuliaS1992 (Talk | contribs) (First Slider draft) |
JuliaS1992 (Talk | contribs) m |
||
| Line 18: | Line 18: | ||
this.currentIndex = 0 | this.currentIndex = 0 | ||
| + | this.clock() | ||
}, | }, | ||
goTo: function(index) { | goTo: function(index) { | ||
| - | // | + | clearTimeout(this.Interval) |
| + | // circle through indices | ||
if (index < 0) index = this.li.length - 1; | if (index < 0) index = this.li.length - 1; | ||
else if (index > this.li.length - 1) index = 0; | else if (index > this.li.length - 1) index = 0; | ||
| Line 26: | Line 28: | ||
// move <ul> left | // move <ul> left | ||
this.ul.style.left = '-' + (100 * index) + '%' | this.ul.style.left = '-' + (100 * index) + '%' | ||
| - | + | this.clock() | |
| - | this.currentIndex = index | + | this.currentIndex = index |
}, | }, | ||
goToPrev: function() { | goToPrev: function() { | ||
| Line 34: | Line 36: | ||
goToNext: function() { | goToNext: function() { | ||
this.goTo(this.currentIndex + 1) | this.goTo(this.currentIndex + 1) | ||
| + | }, | ||
| + | clock: function() { | ||
| + | var self = this; | ||
| + | this.Interval = setInterval(function() {self.goToNext()}, 2500); | ||
} | } | ||
} | } | ||
| Line 40: | Line 46: | ||
<div id="SliderWrap"> | <div id="SliderWrap"> | ||
<div id="SliderPrev"><a href="#" onclick="sliderMain.goToPrev();return(false);"><</a></div><!-- | <div id="SliderPrev"><a href="#" onclick="sliderMain.goToPrev();return(false);"><</a></div><!-- | ||
| - | --><div id="Slider"> | + | --><div id="Slider" onmouseover="clearTimeout(sliderMain.Interval)" onmouseout="sliderMain.clock()"> |
<ul id="SliderUl"> | <ul id="SliderUl"> | ||
| Line 67: | Line 73: | ||
<script> | <script> | ||
var sliderMain = new Slider(document.getElementById("Slider")); | var sliderMain = new Slider(document.getElementById("Slider")); | ||
| - | |||
</script> | </script> | ||
<style type="text/css"> | <style type="text/css"> | ||
Revision as of 13:06, 2 September 2013
Team
Project
Notebook
Parts
Cool tool
Human Practice
Safety
bli
bla
additional: blub
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 StoneLorem 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 StoneLorem 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 StoneLorem 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 StoneLorem 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 StoneLorem 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 StoneLorem 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 StoneLorem 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 StoneLorem 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 StoneLorem 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. |
