Team:LMU-Munich/Templates/Page Header
From 2012.igem.org
(Difference between revisions)
m (more menu tweaks) |
(added slideshow script) |
||
Line 291: | Line 291: | ||
/* color: #68387b; */ | /* color: #68387b; */ | ||
color: #16933f; | color: #16933f; | ||
+ | } | ||
+ | |||
+ | /* slideshow stuff */ | ||
+ | |||
+ | .slideshow { | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | |||
+ | .slideshow li { | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | left: -100%; | ||
+ | top: 0; | ||
+ | } | ||
+ | |||
+ | .slideshow div.antilink { | ||
+ | position: absolute; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | .slideshow div.next { | ||
+ | position: absolute; | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | border-left: 20px solid /*#7b609b*/ white; | ||
+ | border-top: 20px solid transparent; | ||
+ | border-bottom: 20px solid transparent; | ||
+ | right: 20px; | ||
+ | top: 50%; | ||
+ | margin-top: -20px; | ||
} | } | ||
</style> | </style> | ||
Line 382: | Line 414: | ||
var style = document.getElementById("hoverstyle"); | var style = document.getElementById("hoverstyle"); | ||
style.parentNode.removeChild(style); | style.parentNode.removeChild(style); | ||
+ | |||
+ | var divs = document.getElementsByTagName("div"); | ||
+ | for(var i = 0; i < divs.length; ++i) { | ||
+ | var slideshow = divs[i]; | ||
+ | if(slideshow.getAttribute("class") != "slideshow") { | ||
+ | continue; | ||
+ | } | ||
+ | |||
+ | slideshow.lis = slideshow.getElementsByTagName("li"); | ||
+ | slideshow.current_li = 0; | ||
+ | slideshow.next_li = 1; | ||
+ | slideshow.time = 1.; | ||
+ | slideshow.timeout = null; | ||
+ | slideshow.fast = false; | ||
+ | |||
+ | slideshow.set_timeout = function(timeout, callback) { | ||
+ | if(slideshow.timeout != null) { | ||
+ | window.clearTimeout(slideshow.timeout); | ||
+ | } | ||
+ | slideshow.last_time = (new Date()).getTime(); | ||
+ | slideshow.timeout = window.setTimeout(callback, timeout); | ||
+ | } | ||
+ | |||
+ | slideshow.timestep = function() { | ||
+ | if(slideshow.time == 0) { | ||
+ | dt = 20; | ||
+ | } else { | ||
+ | var time = (new Date()).getTime(); | ||
+ | var dt = time - slideshow.last_time; | ||
+ | slideshow.last_time = time; | ||
+ | } | ||
+ | slideshow.time += dt / (slideshow.fast ? 1000. : 3000.); | ||
+ | if(slideshow.time >= 1.) { | ||
+ | slideshow.time = 1.; | ||
+ | } | ||
+ | var anim_time = .5 - .5 * Math.cos(slideshow.time * 3.141); | ||
+ | slideshow.lis[slideshow.current_li].style.left = anim_time * -100 + "%"; | ||
+ | slideshow.lis[slideshow.next_li].style.left = (1. - anim_time) * 100 + "%"; | ||
+ | |||
+ | if(slideshow.time >= 1.) { | ||
+ | // slideshow.lis[slideshow.current_li].style.display = "none"; | ||
+ | slideshow.current_li = slideshow.next_li; | ||
+ | slideshow.next_li = slideshow.next_li + 1 >= slideshow.lis.length ? 0 : slideshow.next_li + 1; | ||
+ | slideshow.time = 0; | ||
+ | slideshow.fast = false; | ||
+ | // alert(slideshow.next_li); | ||
+ | // alert(slideshow.current_li); | ||
+ | slideshow.set_timeout(5000, slideshow.timestep); | ||
+ | // slideshow.lis[slideshow.next_li].style.display = "block"; | ||
+ | // slideshow.lis[slideshow.next_li].z_index = "2"; | ||
+ | // slideshow.lis[slideshow.current_li].z_index = "1"; | ||
+ | } else { | ||
+ | slideshow.set_timeout(20, slideshow.timestep); | ||
+ | } | ||
+ | var antilink = document.createElement("div"); | ||
+ | antilink.setAttribute("class", "antilink"); | ||
+ | slideshow.appendChild(antilink); | ||
+ | var div = document.createElement("div"); | ||
+ | div.setAttribute("class", "next"); | ||
+ | slideshow.appendChild(div); | ||
+ | div.onclick = function() { | ||
+ | slideshow.set_timeout(0, slideshow.timestep); | ||
+ | slideshow.fast = true; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | slideshow.set_timeout(0, slideshow.timestep); | ||
+ | } | ||
</script> | </script> | ||
<div id="left"> | <div id="left"> |
Revision as of 10:49, 8 September 2012
The LMU-Munich team is exuberantly happy about the great success at the World Championship Jamboree in Boston. Our project Beadzillus finished 4th and won the prize for the "Best Wiki" (with Slovenia) and "Best New Application Project".
[ more news ]
Page title
List of templates:
- Team:LMU-Munich/Templates/Page Header
- this page, include at the start of every page, the first parameter specifies the image to be shown in the sidebar
- Team:LMU-Munich/Templates/Page Footer
- include at the end of every page
- Team:LMU-Munich/Templates/Navigation
- edit the menu here
- Team:LMU-Munich/Templates/News
- the text in the sidebar