Team:Tianjin/header

From 2012.igem.org

(Difference between revisions)
 
(22 intermediate revisions not shown)
Line 16: Line 16:
   $(this).stop().animate({opacity: 0}, "slow");
   $(this).stop().animate({opacity: 0}, "slow");
});
});
-
});
+
  $("#secondpane p.menu_head").mouseover(function()
-
</script>
+
-
<html>
+
-
<script type="text/javascript">
+
-
$(document).ready(function()
+
-
{
+
-
//slides the element with class "menu_body" when mouse is over the paragraph
+
-
$("#secondpane p.menu_head").mouseover(function()
+
     {
     {
    $(this).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
    $(this).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
Line 29: Line 22:
});
});
});
});
 +
</script>
 +
<script type="text/javascript">
 +
function getScrollTop() {
 +
    var scrollPos;
 +
    if (window.pageYOffset) {
 +
        scrollPos = window.pageYOffset;
 +
    }
 +
    else if (document.compatMode) {
 +
    if(document.compatMode != 'BackCompat')
 +
    {
 +
        scrollPos = document.documentElement.scrollTop;
 +
        }
 +
        else if (document.body)
 +
        {
 +
        scrollPos = document.body.scrollTop;
 +
    }
 +
    }
 +
    if(scrollPos < 110){
 +
document.getElementById("right-fixed").className="right-static";
 +
}
 +
else{
 +
document.getElementById("right-fixed").className="right-fixed";
 +
}
 +
    if(scrollPos < 216){
 +
document.getElementById("secondpane").className=" ";
 +
}
 +
else{
 +
document.getElementById("secondpane").className="menu_list";
 +
}
 +
}
 +
window.onscroll=getScrollTop;
</script>
</script>
Line 47: Line 71:
<div id="track">
<div id="track">
-
<div id="right-fixed">
+
<div id="right-fixed" class="right-static">
<div id="nav-5" class="block" style="background:{{{Bgc5}}};position:relative;">[[file:{{{B5}}}|link={{{url5}}}]]
<div id="nav-5" class="block" style="background:{{{Bgc5}}};position:relative;">[[file:{{{B5}}}|link={{{url5}}}]]
<div id="navtext-5" class="navtext" style="position:absolute;left:5px;top:5px;">[[file:{{{Btr5}}}|link={{{url5}}}]]</div></div>
<div id="navtext-5" class="navtext" style="position:absolute;left:5px;top:5px;">[[file:{{{Btr5}}}|link={{{url5}}}]]</div></div>
Line 65: Line 89:
<div id="wrap">
<div id="wrap">
<div id="secondwrap" style="border:8px solid {{{BorCor}}}">
<div id="secondwrap" style="border:8px solid {{{BorCor}}}">
-
<div style="float:left; margin-left:20px;"> <!--This is the second division of right-->
 
-
  <p><strong>Works with mouse over </strong></p>
 
-
  <div class="menu_list" id="secondpane"> <!--Code for menu starts here-->
 
-
<p class="menu_head" style="background: {{{BorCor}}}">Header-1</p>
 
-
<div class="menu_body"">
 
-
        <div class="menu_children">
 
-
<a href="#">Link-1</a>
 
-
        </div>
 
-
        <div class="menu_children">
 
-
<a href="#">Link-2</a>
 
-
        </div>
 
-
        <div class="menu_children">
 
-
<a href="#">Link-3</a>
 
-
        </div>
 
-
</div>
 
-
<p class="menu_head" style="background: {{{BorCor}}}">Header-2</p>
 
-
<div class="menu_body">
 
-
        <div class="menu_children">
 
-
<a href="#">Link-1</a>
 
-
        </div>
 
-
        <div class="menu_children">
 
-
<a href="#">Link-2</a>
 
-
        </div>
 
-
        <div class="menu_children">
 
-
<a href="#">Link-3</a>
 
-
        </div>
 
-
</div>
 
-
<p class="menu_head" style="background: {{{BorCor}}}">Header-3</p>
 
-
<div class="menu_body">
 
-
        <div class="menu_children">
 
-
<a href="#">Link-1</a>
 
-
        </div>
 
-
        <div class="menu_children">
 
-
<a href="#">Link-2</a>
 
-
        </div>
 
-
        <div class="menu_children">
 
-
<a href="#">Link-3</a>
 
-
        </div>
 
-
      </div>
 
-
  </div>      <!--Code for menu ends here-->
 
-
</div>
 
-
<div id="text-content">
 

Latest revision as of 07:25, 24 September 2012