Team:Heidelberg/Templates/StartPage

From 2013.igem.org

(Difference between revisions)
m
 
(46 intermediate revisions not shown)
Line 3: Line 3:
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Stylesheet?action=raw&ctype=text/css" type="text/css" />
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Stylesheet?action=raw&ctype=text/css" type="text/css" />
 +
<script type="text/javascript">
<script type="text/javascript">
<!--
<!--
-
window.onload = function() {
+
window.onresize = function() {
 +
rotateMenu("menu-team", getMenuAngle(2.2));
 +
rotateMenu("menu-project", getMenuAngle(1.2));
 +
rotateMenu("menu-notebook", getMenuAngle(0.2));
 +
rotateMenu("menu-parts", getMenuAngle(0));
 +
rotateMenu("menu-modelling", getMenuAngle(0.2), -1);
 +
rotateMenu("menu-human", getMenuAngle(1.2), -1);
 +
rotateMenu("menu-safety", getMenuAngle(2.2), -1);
 +
}
 +
 +
window.onload = function() {
var drop_lists = document.getElementsByClassName("drop-navi-left");
var drop_lists = document.getElementsByClassName("drop-navi-left");
for (var i = 0; i < drop_lists.length; i++) {
for (var i = 0; i < drop_lists.length; i++) {
Line 19: Line 30:
navi_links[i].style.color = "#FFCC00";
navi_links[i].style.color = "#FFCC00";
var element = navi_links[i];
var element = navi_links[i];
-
while (element.parentNode.parentNode.tagName == "UL") {
+
while (element.parentNode.tagName !== "DIV") {
-
var element = element.parentNode.parentNode;
+
var element = element.parentNode;
 +
if (element.tagName == "LI") element.style.display = "list-item";
 +
else element.style.display = "block";
 +
}
 +
var element = navi_links[i].parentNode;
 +
if (element.className == "drop-navi-left") {
 +
while (element.tagName !== "UL") {
 +
var element = element.nextSibling;
 +
}
element.style.display = "block";
element.style.display = "block";
}
}
Line 26: Line 45:
}
}
}
}
 +
}
}
function start_tour() {
function start_tour() {
Line 57: Line 77:
} else {
} else {
list.style.display = "none";
list.style.display = "none";
 +
}
 +
}
 +
function getMenuAngle(position) {
 +
var menu = document.getElementById("main-menu");
 +
var width = menu.offsetWidth;
 +
var a = 0.5 * width;
 +
var b = menu.offsetHeight;
 +
var wpos = width * position * 0.1;
 +
var t = Math.acos(wpos / a);
 +
var beta = Math.atan(a / b * Math.tan(t));
 +
var angle = Math.PI * 0.5 - beta;
 +
var y = b - b * Math.sin(t);
 +
return Array(angle,y);
 +
}
 +
function rotateMenu(id, angle, factor) {
 +
if (factor !== undefined)
 +
    angle[0] *= factor;
 +
var root = document.getElementById(id);
 +
root.style.position = "relative";
 +
root.style.top = "calc(5.3em - " + angle[1] + "px)"; // 100px from #main-menu
 +
var children = root.children;
 +
for (var i = 0; i < children.length; ++i) {
 +
                        if (children[i].nodeName == "A") {
 +
                            children[i].style.transform = "rotate(" + angle[0] + "rad)";
 +
                            break;
 +
}
}
}
}
}
-->
-->
-
        function getMenuAngle(position)
 
-
        {
 
-
            var menu = document.getElementById("main-menu");
 
-
            var width = menu.offsetWidth;
 
-
            var a = 0.5 * width;
 
-
            var b = menu.offsetHeight;
 
-
            var wpos = width * position * 0.1;
 
-
            var t = Math.acos(wpos / a);
 
-
            var beta = Math.atan(a / b * Math.tan(t));
 
-
            var angle = Math.PI * 0.5 - beta;
 
-
            var y = b * Math.sin(t);
 
-
            return Array(angle,y);
 
-
        }
 
-
        function rotateMenu(id, angle, factor)
 
-
        {
 
-
            if (factor !== undefined)
 
-
                angle[0] *= factor;
 
-
            var root = document.getElementById(id);
 
-
            root.style = "transform:rotate(" + angle[0] + "rad);position:relative;top:" + (angle[1] - 20) + "px;";
 
-
            var children = root.children;
 
-
            for (var i = 0; i < children.length; ++i) {
 
-
                if (children[i].nodeName == "UL") {
 
-
                    children[i].style = "transform:rotate(" + (angle[0] * -1) + "rad)";
 
-
                }
 
-
            }
 
-
        }
 
-
        window.onload = function() {
 
-
            rotateMenu("menu-team", getMenuAngle(2.5));
 
-
            rotateMenu("menu-project", getMenuAngle(1.5));
 
-
            rotateMenu("menu-notebook", getMenuAngle(0.5));
 
-
            rotateMenu("menu-parts", getMenuAngle(0));
 
-
            rotateMenu("menu-modelling", getMenuAngle(0.5), -1);
 
-
            rotateMenu("menu-human", getMenuAngle(1.5), -1);
 
-
            rotateMenu("menu-safety", getMenuAngle(2.5), -1);
 
-
      }
 
</script>
</script>
Line 102: Line 113:
</html>
</html>
{{:Team:Heidelberg/Templates/TopNavigation}}
{{:Team:Heidelberg/Templates/TopNavigation}}
-
{{{1}}}
 
<html>
<html>
-
 
</p></div> <!-- end headline -->
</p></div> <!-- end headline -->
</div> <!-- end top-matter -->
</div> <!-- end top-matter -->
Line 130: Line 139:
</ul>
</ul>
</div>
</div>
-
<a href="#top" id="goto-top">Go to top</a>
+
<!--<a href="#top" id="goto-top">Go to top</a>-->
</html>
</html>

Latest revision as of 11:09, 13 September 2013

PHILOSOPHER'S STONE

igem-2013

{{:Team:Heidelberg/Templates/{{{2}}}}}

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