Team:Heidelberg/DesignTest

From 2013.igem.org

(Difference between revisions)
m
m
 
(44 intermediate revisions not shown)
Line 2: Line 2:
<html>
<html>
 +
<!-- Warning! Although the jQuery loaded is declared in the framework code as "latest" it is version 1.4.2!
 +
Hence we need to load it ourselves
 +
-->
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<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" />
 +
 +
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Stylesheet/Slider?action=raw&ctype=text/css" type="text/css" />
<script type="text/javascript">
<script type="text/javascript">
<!--
<!--
 +
 +
      var cssCalcExpression = (function() {
 +
 +
    var vendorPrefixes = new Array('-o-','-moz-','-webkit-', ''),
 +
    retrievedValue,
 +
    prefix;
 +
 +
  while (vendorPrefixes.length > 0)
 +
  {
 +
  prefix = vendorPrefixes.pop();
 +
  retrievedValue = $(
 +
  "<span style='display:none;width:"
 +
  + prefix
 +
  + "calc(10px)'></span>" ).appendTo( "body" ).css('width' );
 +
  if (retrievedValue === '10px') {
 +
return function(expression, defaultValue) {
 +
return prefix + 'calc(' + expression + ')';
 +
};
 +
 +
}
 +
  }
 +
 +
  return function(expression, defaultValue) {
 +
return defaultValue ? defaultValue : '';
 +
};
 +
}());
 +
 +
window.onresize = function() {
window.onresize = function() {
rotateMenu("menu-team", getMenuAngle(2.2));
rotateMenu("menu-team", getMenuAngle(2.2));
Line 15: Line 49:
rotateMenu("menu-safety", getMenuAngle(2.2), -1);
rotateMenu("menu-safety", getMenuAngle(2.2), -1);
}
}
-
+
 
-
window.onload = function() {
+
//NEW. Merged existing window.onload() with slider initialization
-
var drop_lists = document.getElementsByClassName("drop-navi-left");
+
 
-
for (var i = 0; i < drop_lists.length; i++) {
+
(function() {
-
var item = drop_lists[i];
+
 
-
while (item.tagName !== "UL") {
+
 
-
var item = item.nextSibling;
+
                //alert("jQuery Version: " + jQuery.fn.jquery);
-
}
+
 
-
item.style.display = "none";
+
 
-
}
+
 
-
var navi_links = document.getElementById("navigation-bar").getElementsByTagName("A");
+
$(window).load(function() {
-
for (var i = 0; i < navi_links.length; i++) {
+
 
-
if (document.documentURI.indexOf(navi_links[i].href) !== -1) {
+
 
-
navi_links[i].style.color = "#FFCC00";
+
(function(){
-
var element = navi_links[i];
+
try {
-
while (element.parentNode.tagName !== "DIV") {
+
var drop_lists = document.getElementsByClassName("drop-navi-left");
-
var element = element.parentNode;
+
for (var i = 0; i < drop_lists.length; i++) {
-
if (element.tagName == "LI") element.style.display = "list-item";
+
var item = drop_lists[i];
-
else element.style.display = "block";
+
while (item.tagName !== "UL") {
-
}
+
var item = item.nextSibling;
-
var element = navi_links[i].parentNode;
+
}
-
if (element.className == "drop-navi-left") {
+
item.style.display = "none";
-
while (element.tagName !== "UL") {
+
-
var element = element.nextSibling;
+
}
}
-
element.style.display = "block";
+
 +
var navbar = document.getElementById("navigation-bar");
 +
if (navbar) {
 +
var navi_links = navbar.getElementsByTagName("A");
 +
for (var i = 0; i < navi_links.length; i++) {
 +
if (document.documentURI.indexOf(navi_links[i].href) !== -1) {
 +
navi_links[i].style.color = "#FFCC00";
 +
var element = navi_links[i];
 +
while (element.parentNode.tagName !== "DIV") {
 +
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";
 +
}
 +
break;
 +
}
 +
}
 +
 
 +
}
 +
 +
 
}
}
-
break;
+
catch (e) {
 +
//alert(e);
 +
}
 +
 
 +
})();
 +
 +
 
 +
 
 +
var $flexslider = $('.flexslider');
 +
 +
//only do when there is any slider on the page
 +
if ($flexslider) {
 +
 
 +
 
 +
(function() {
 +
var linkelem;
 +
 
 +
//load the slider specific CSS
 +
/*linkelem = document.createElement('link');
 +
linkelem.setAttribute("rel", "stylesheet");
 +
linkelem.setAttribute("type", "text/css");
 +
linkelem.setAttribute("href", "https://2013.igem.org/Team:Heidelberg/Stylesheet/Slider?action=raw&ctype=text/css");
 +
document.getElementsByTagName("head")[0].appendChild(linkelem);*/
 +
 +
//add favorite icon if specified
 +
var faviconURL =""; //favicon.ico
 +
if (faviconURL){
 +
linkelem = document.createElement('link');
 +
linkelem.setAttribute("rel", "shortcur icon");
 +
linkelem.setAttribute("type", "image/x-icon");
 +
linkelem.setAttribute("href", faviconURL);
 +
document.getElementsByTagName("head")[0].appendChild(linkelem);
 +
}
 +
 +
 +
})();
 +
 
 +
//load the slider specific javascript code
 +
$.getScript("https://2013.igem.org/Team:Heidelberg/JS?action=raw&ctype=text/javascript", function(data, textStatus, jqxhr) {
 +
 +
//alert(textStatus);
 +
    $flexslider.flexslider({
 +
      animation: "slide",
 +
      animationLoop: true,
 +
      itemWidth: 110,
 +
      itemMargin: 0,
 +
      minItems: 1,
 +
      maxItems: 3
 +
    });
 +
 
 +
    });
}
}
-
}
+
 
 +
  });
 +
 +
 
 +
}());
 +
 
 +
//from here on same as before
-
  $('.flexslider').flexslider({
 
-
      animation: "slide",
 
-
      animationLoop: true,
 
-
      itemWidth: 300,
 
-
      itemMargin: 0,
 
-
      minItems: 1,
 
-
      maxItems: 3,
 
-
 
-
pauseOnHover: true,
 
-
slideshowSpeed: 3000,
 
-
animationSpeed: 700
 
-
   
 
-
});
 
-
 
-
}
 
function start_tour() {
function start_tour() {
var tour_navi = document.getElementById("tour-navi");
var tour_navi = document.getElementById("tour-navi");
Line 95: Line 194:
function getMenuAngle(position) {
function getMenuAngle(position) {
var menu = document.getElementById("main-menu");
var menu = document.getElementById("main-menu");
 +
if (menu){
var width = menu.offsetWidth;
var width = menu.offsetWidth;
var a = 0.5 * width;
var a = 0.5 * width;
Line 104: Line 204:
var y = b - b * Math.sin(t);
var y = b - b * Math.sin(t);
return Array(angle,y);
return Array(angle,y);
 +
}
 +
else return Array(1,1);
}
}
function rotateMenu(id, angle, factor) {
function rotateMenu(id, angle, factor) {
Line 110: Line 212:
var root = document.getElementById(id);
var root = document.getElementById(id);
root.style.position = "relative";
root.style.position = "relative";
-
root.style.top = "calc(5.3em - " + angle[1] + "px)"; // 100px from #main-menu
+
root.style.top = cssCalcExpression("5.3em - " + angle[1] + "px", "5.3em"); // 100px from #main-menu
var children = root.children;
var children = root.children;
for (var i = 0; i < children.length; ++i) {
for (var i = 0; i < children.length; ++i) {
Line 154: Line 256:
</div>
</div>
<!--<a href="#top" id="goto-top">Go to top</a>-->
<!--<a href="#top" id="goto-top">Go to top</a>-->
 +
<p> <!--test-->
</html>
</html>
Line 163: Line 266:
<html>
<html>
-
<link rel="stylesheet" href="https://2013.igem.org/Team:Heidelberg/Stylesheet/Slider?action=raw&ctype=text/css" type="text/css">
 
 +
 +
<!-- start Slider -->
<!-- start Slider -->
<div id="carousel" class="flexslider">
<div id="carousel" class="flexslider">
Line 179: Line 283:
      <img src="https://static.igem.org/mediawiki/2013/8/83/Heidelberg_menu_symbol4.png" />
      <img src="https://static.igem.org/mediawiki/2013/8/83/Heidelberg_menu_symbol4.png" />
    </li>
    </li>
-
<li>
+
  <li>
-
      <img src="https://static.igem.org/mediawiki/2013/a/a4/Heidelberg_menu_symbol1.png" />
+
      <img src="https://static.igem.org/mediawiki/2013/a/a4/Heidelberg_menu_symbol3.png" />
    </li>
    </li>
    <li>
    <li>
-
      <img src="https://static.igem.org/mediawiki/2013/c/c4/Heidelberg_menu_symbol2.png" />
+
      <img src="https://static.igem.org/mediawiki/2013/c/c4/Heidelberg_menu_symbol5.png" />
    </li>
    </li>
    <li>
    <li>
-
      <img src="https://static.igem.org/mediawiki/2013/8/83/Heidelberg_menu_symbol4.png" />
+
      <img src="https://static.igem.org/mediawiki/2013/8/83/Heidelberg_menu_symbol6.png" />
    </li>
    </li>
  </ul>
  </ul>
Line 221: Line 325:
<h5>Philosophers Stone</h5>
<h5>Philosophers Stone</h5>
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.  
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.  
 +
<object data="https://2013.igem.org/wiki/index.php?title=Team:Heidelberg/DesignTest/Circle.svg&action=render&oldid=259395" type="image/svg+xml">
 +
    <param name="src" value="https://2013.igem.org/wiki/index.php?title=Team:Heidelberg/DesignTest/Circle.svg&action=render&oldid=259395">
 +
    Ihr Browser kann das Objekt leider nicht anzeigen!
 +
</object>
</td>
</td>
</tr>
</tr>
Line 345: Line 453:
</html>
</html>
 +
{{:Team:Heidelberg/Templates/EndPage}}
{{:Team:Heidelberg/Templates/EndPage}}

Latest revision as of 15:51, 1 October 2013

PHILOSOPHER'S STONE

igem-2013



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. Ihr Browser kann das Objekt leider nicht anzeigen!
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