Biomod/2012/OSU/OhioMOD: Difference between revisions
No edit summary |
No edit summary |
||
Line 88: | Line 88: | ||
</script> | </script> | ||
<script type="text/javascript"> | |||
$(document).ready(function() | |||
{ | |||
var $allListElements = $('div'); | |||
$("#total").find($allListElements).each(function(){$(this).mouseenter(function(){$(this).fadeTo('fast', 0.5, function() {});});}); | |||
$("#total").find($allListElements).each(function(){$(this).mouseleave(function(){$(this).fadeTo('fast', 1, function() {});});}); | |||
}); | |||
</script> | |||
</head> | </head> | ||
Line 119: | Line 129: | ||
<div class="section"> | <div class="section"> | ||
<h1>Methods</h1> | <h1>Methods</h1> | ||
<center> | |||
<div id='total' style="display:inline-block; width:680px; margin-top:5%;"> | |||
<div id='databox' name='databox' style='background-color:#666666'></div> | |||
<div id='databox' name='databox' style='background-color:#666666'></div> | |||
<div id='databox' name='databox' style='background-color:#666666'></div> | |||
<div id='databox' name='databox' style='background-color:#666666'></div> | |||
<div id='databox' name='databox' style='background-color:#666666'></div> | |||
<div id='databox' name='databox' style='background-color:#666666'></div> | |||
</div> | |||
</center> | |||
</div> | </div> | ||
<div class="section"> | <div class="section"> |
Revision as of 19:50, 24 October 2012
<html> <head> <link rel="stylesheet" href="http://dl.dropbox.com/s/m67naltf0bualg0/main.css" type="text/css" media="screen" /> <link rel="stylesheet" href="http://dl.dropbox.com/s/y6lp9909xs10md7/flexslider.css" type="text/css" media="screen" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="http://dl.dropbox.com/s/piaqef6ntvm0hnn/jquery.queryloader2.js"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="http://dl.dropbox.com/s/osh1gymcc7eyddv/jquery.pagescroller.lite.js"></script> <script src="http://dl.dropbox.com/s/3ej7jws4d4r4stu/jquery.flexslider-min.js"></script> <script src="http://dl.dropbox.com/s/ii3bdcd8mydr89k/jquery.flexslider.js"></script> <script type="text/javascript" src="http://dl.dropbox.com/s/piaqef6ntvm0hnn/jquery.queryloader2.js"></script>
<script type"text/javascript">
$(window).load(function(){ $('.flexslider').flexslider({ animation: "slide", controlNav: "thumbnails" });
$("#sidebar-main").remove(); $(".portlet").remove(); $("#contentSub").remove(); $("#jump-to-nav").remove(); $("#siteSub").remove(); $(".firstHeading").remove(); $("#footer").remove(); $(".printfooter").remove(); $("style").remove();
});
$(document).ready(function () { // initiate page scroller plugin $('body').pageScroller({ navigation: '#nav' }); $("body").queryLoader2({barColor: "#FFF",backgroundColor: "#000",percentage: true,barHeight: 1,completeAnimation: "grow",minimumTime: 100}); $('head').append('<link rel="stylesheet" href="/skins/monobook/shared.css?164" type="text/css" />'); var winW = window.innerWidth; winH = window.innerHeight; $(".section").height(winH); $('#team_slider').height(winH/1.25); $('#team_slider').width(winH/1.25); $('header').height(winH-60); document.getElementById('frontvar').style.paddingTop =(winH/3-20)+"px";
//Calculate the height of <header> //Use outerHeight() instead of height() if have padding
var aboveHeight = winH-60;//$('header').height()+1050;
// when scroll
$(window).scroll(function(){
//if scrolled down more than the header's height
if ($(window).scrollTop() > aboveHeight){
// if yes, add "fixed" class to the <nav> // add padding top to the #content (value is same as the height of the nav)
$('nav').addClass('fixed').css('top','0').next().css('padding-top','60px'); } else {
// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top
$('nav').removeClass('fixed').next().css('padding-top','0px'); } });
});
//when window resize $(window).resize(function() { var winW = window.innerWidth; winH = window.innerHeight; $(".section").height(winH); $('#team_slider').height(winH/1.25); $('#team_slider').width(winH/1.25); $('header').height(winH-60); document.getElementById('frontvar').style.paddingTop =(winH/3-20)+"px";
//Calculate the height of <header> //Use outerHeight() instead of height() if have padding
var aboveHeight = winH-60;//$('header').height()+1050;
// when scroll
$(window).scroll(function(){
//if scrolled down more than the header's height
if ($(window).scrollTop() > aboveHeight){
// if yes, add "fixed" class to the <nav> // add padding top to the #content (value is same as the height of the nav)
$('nav').addClass('fixed').css('top','0').next().css('padding-top','60px'); } else {
// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top
$('nav').removeClass('fixed').next().css('padding-top','0px'); } });
});
</script>
<script type="text/javascript"> $(document).ready(function() { var $allListElements = $('div'); $("#total").find($allListElements).each(function(){$(this).mouseenter(function(){$(this).fadeTo('fast', 0.5, function() {});});}); $("#total").find($allListElements).each(function(){$(this).mouseleave(function(){$(this).fadeTo('fast', 1, function() {});});}); }); </script>
</head>
<body> <header>
<center> <img id="frontvar" src="http://dl.dropbox.com/s/5ye82pz6sieqlzy/front_logo.jpg"/> </center> </header>
<div id="wrapper">
<nav> <div id="nav" class="standardNav"> <ul> <li><a href="#">#Background</a></li> <li><a href="#">#Project</a></li> <li><a href="#">#Methods</a></li> <li><a href="#">#Results</a></li> <li><a href="#">#Resources</a></li> <li><a href="#">#The Team</a></li> </ul> <div id="nav_biomod"><img src="http://dl.dropbox.com/s/s986aya26k1bbiu/nav_footer.png"></div> </div> </nav> <div id="main"> <div class="section"> <h1>Background</h1> </div> <div class="section"> <h1>Project</h1> </div> <div class="section"> <h1>Methods</h1>
<center> <div id='total' style="display:inline-block; width:680px; margin-top:5%;">
<div id='databox' name='databox' style='background-color:#666666'></div>
<div id='databox' name='databox' style='background-color:#666666'></div> <div id='databox' name='databox' style='background-color:#666666'></div> <div id='databox' name='databox' style='background-color:#666666'></div> <div id='databox' name='databox' style='background-color:#666666'></div> <div id='databox' name='databox' style='background-color:#666666'></div> </div> </center>
</div> <div class="section"> <h1>Results/Discussion</h1> </div> <div class="section"> <h1>Resources</h1> </div> <div class="section"> <h1>The Team</h1> <center> <div id="team_slider" role="team_slider"> <section class="slider"> <div class="flexslider"> <ul class="slides"> <li data-thumb="http://dl.dropbox.com/s/fpobpvxondszu99/theteam_nav.jpg"> <img src="http://dl.dropbox.com/s/3v3ra748y0px1sk/hjgj.jpg"></li> <li data-thumb="http://dl.dropbox.com/s/c1lakz9038tctat/castro_nav.jpg"> <img src="http://dl.dropbox.com/s/dludspdi4kgt8m6/castro_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/wucsphgdkswuter/hudoba_nav.jpg"> <img src="http://dl.dropbox.com/s/kn6s88wtb7t9ex6/hudoba_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/qv2vpqo2fqzgchy/marras_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/z0fxjhc3qshb79r/autran_nav.jpg"> <img src="http://dl.dropbox.com/s/1ee9xvpinxxsh15/autran_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/3mxgbma3ytfm61s/bossart_nav.jpg"> <img src="http://dl.dropbox.com/s/lsty77hjlc5f19i/bossart_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/rto7gtk9cv97g3e/brockman_nav.jpg"> <img src="http://dl.dropbox.com/s/3s3y1ec7tpr1wmh/brockman_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/2ur94d8koicrnx0/crawford_nav.jpg"> <img src="http://dl.dropbox.com/s/39tuhnzf9i3hc09/crawford_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/dsdnsrxcubk08en/justus_nav.jpg"> <img src="http://dl.dropbox.com/s/bjgpil6tqvvi9y2/justus_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/pfckd5kuddq3xh9/lynch_nav.jpg"> <img src="http://dl.dropbox.com/s/gvq7l14k34kpexe/lynch_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/wsvj1mxw1sc157c/marquart_nav.jpg"> <img src="http://dl.dropbox.com/s/mzuzzddek94423h/marquart_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/s57dszk8rnoay1i/morales_nav.jpg"> <img src="http://dl.dropbox.com/s/mjh8xnl53jrsgcl/morales_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/xrnssm96cd7kd26/sohutskay_nav.jpg"> <img src="http://dl.dropbox.com/s/7z95aekcl18pnr6/sohutskay_slide.jpg" /> </li> <li data-thumb="http://dl.dropbox.com/s/2xt1g8j6rk7uvxu/viznyuk_nav.jpg"> <img src="http://dl.dropbox.com/s/tjxjrikazs7n78p/viznyuk_slide.jpg" /> </li> </ul> </div> </section> </div> </center> </div> </div> </div> <!-- [END] #main --> </div>
<!-- [END] #wrapper --> </html>