Team:Baskent-Meds/Gallery

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+
<html>
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
Line 6: Line 6:
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.js" type="text/javascript"></script>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.js" type="text/javascript"></script>
<script src="http://buildinternet.com/live/smoothmenu/js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="http://buildinternet.com/live/smoothmenu/js/jquery.easing.1.3.js" type="text/javascript"></script>
-
<script src="http://buildinternet.com/live/smoothmenu/animated-menu.js" type="text/javascript"></script>
 
-
<script language="JavaScript" type="text/JavaScript">
 
<!--
<!--
 +
<script>
 +
$(document).ready(function(){
 +
 +
//Fix Errors - http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup/
 +
 +
//Remove outline from links
 +
$("a").click(function(){
 +
$(this).blur();
 +
});
 +
 +
//When mouse rolls over
 +
$("li").mouseover(function(){
 +
$(this).stop().animate({height:'150px'},{queue:false, duration:600, easing: 'easeOutBounce'})
 +
});
 +
 +
//When mouse is removed
 +
$("li").mouseout(function(){
 +
$(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'})
 +
});
 +
 +
});
 +
 +
-->
 +
</script>
 +
<link rel="stylesheet" type="text/css" media="screen" href="http://www.bustack.com/wiki/css/coda-slider.css">
 +
<link rel="stylesheet" href="http://www.bustack.com/wiki/nivo/themes/default/default.css" type="text/css" media="screen" />
 +
<link rel="stylesheet" href="http://www.bustack.com/wiki/nivo/nivo-slider.css" type="text/css" media="screen" />
 +
<link rel="stylesheet" href="http://www.bustack.com/wiki/nivo/demo/style.css" type="text/css" media="screen" />
 +
 +
    </script>
 +
<script language="JavaScript" type="text/JavaScript">
 +
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
   if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
   if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
Line 15: Line 45:
}
}
MM_reloadPage(true);
MM_reloadPage(true);
-
//-->
+
 
</script>
</script>
-
<style type="text/css">
+
<script type="text/javascript" src="http://www.bustack.com/wiki/nivo/demo/scripts/jquery-1.7.1.min.js"></script>
 +
    <script type="text/javascript" src="http://www.bustack.com/wiki/nivo/jquery.nivo.slider.js"></script>
 +
 +
    <style type="text/css">
<!--
<!--
-
.style5 {color: #000000}
+
.style12 {
 +
color: #000000;
 +
font-size: 24px;
 +
}
-->
-->
-
</style>
+
    </style>
</head>   
</head>   
<style type="text/css">
<style type="text/css">
-
+
h1{margin:100px;}#top-section {height: 20px;border-left: none;border-right: none;}
-
#top-section {height: 20px;border-left: none;border-right: none;}
+
#siteSub {display:none;}
#siteSub {display:none;}
#search-controls {display:none;}
#search-controls {display:none;}
Line 90: Line 125:
    
    
   
   
-
 
+
 
/*Menu Color Classes*/   
/*Menu Color Classes*/   
 +
.green{
.green{
background:#6AA63B;
background:#6AA63B;
Line 122: Line 158:
font-size: 18px;
font-size: 18px;
}  
}  
-
.style2 {
 
-
font-size: 16px;
 
-
color: #FFFFFF;
 
-
}
 
     a:link {
     a:link {
text-decoration: none;
text-decoration: none;
Line 141: Line 173:
color: #FFFFFF;
color: #FFFFFF;
}
}
-
.style3 {
+
height: 74px;
-
font-size: 24px;
+
width: 74px;
 +
}
 +
    .style13 {
color: #000000;
color: #000000;
 +
font-size: 18px;
}
}
-
     .style4 {font-size: 36px}
+
     .style14 {font-size: 24px}
 +
    .style15 {font-size: 36px}
     </style>
     </style>
</head>   
</head>   
<body>   
<body>   
-
     <div id="Layer2" style="position:absolute; left:-2px; top:0px; width:975px; height:1801px; z-index:2">
+
     <div id="Layer2" style="position:absolute; left:-63px; top:-8px; width:2000px; height:3000px; z-index:2">
-
<div id="Layer1" style="position:absolute; left:-1px; top:-35px; width:906px; height:91px; z-index:1">
+
   
-
    <p>&nbsp;    </p>
+
-
    <ul><li class="green"><p><a href="/Team:Baskent-Meds">Home</a></p>
+
  <div id="Layer3" style="position:absolute; left:-63px; top:-8px; width:1230px; height:1230px; z-index:2">
-
        <p class="subtext">
+
   
-
        <span class="style2">Where we started</span></p>
+
        <div class="slider-wrapper theme-default">
-
        </li>
+
            <div id="slider" class="nivoSlider">
-
        <li class="yellow">
+
               
-
            <p><a href="/Team:Baskent-Meds/Project">Project</a></p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0347.JPG" />
-
            <p class="style2">Our lovely project</p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0351.JPG" />
-
        </li>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0354.JPG" />
-
        <li class="red">
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0377.JPG" />
-
            <p><a href="/Team:Baskent-Meds/Notebook">Notebook</a></p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0378.JPG" />
-
            <p class="style2">Our beloved Notebook</p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0385.JPG" />
-
        </li>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0397.JPG" />
-
        <li class="blue">
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0426.JPG" />
-
            <p><a href="/Team:Baskent-Meds/Results">Results</a></p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0435.JPG" />
-
            <p class="style2">Yeah, that's all, for now </p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0458.JPG" />
-
        </li>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0480.JPG" />
-
        <li class="purple">
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0545.JPG" />
-
            <p><a href="/Team:Baskent-Meds/Gallery">Gallery</a></p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0546.JPG" />
-
            <p class="style2">Our little time capsule</p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0548.JPG" />
-
        </li>  
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0587.JPG" />
-
<li class="pink">
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0610.JPG" />
-
            <p><a href="/Team:Baskent-Meds/Team">Team</a></p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0617.JPG" />
-
            <p class="style2">Shall we meet? </p>
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0628.JPG" />
-
        </li>  
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_0638.JPG" />
-
    </ul>  
+
<img src="http://www.bustack.com/wiki/fancybox/IMG_1085.JPG" />
-
</div>  
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1964.JPG" />
-
  </div>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1969.JPG" />
-
    <div id="maneviyat" style="position:absolute; left:12px; top:150px; width:907px; height:496px; z-index:3"><span class="style3"><span class="style4">Oh! Hi! where have you been?</span><br>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1966.JPG" />
-
    <br>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1976.JPG" />
-
      if i couldn't get some news from you, i was going to call police! also you can't reach your requested section, we haven't done yet, we are on it. you know we are still sustaining our research.<br>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1979.JPG" />
-
      Why don't you follow us maybe Tweet us! Or why don't we have both! </span></div>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1982.JPG" />
-
    <div id="Layer3" class="style5" style="position:absolute; left:534px; top:330px; width:336px; height:72px; z-index:4"><a href="https://twitter.com/iGEM_Baskent_MD" class="twitter-follow-button" data-show-count="false">Follow @iGEM_Baskent_MD</a>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1983.JPG" />
-
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1984.JPG" />
-
    <div id="Layer4" style="position:absolute; left:77px; top:305px; width:269px; height:124px; z-index:5">
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1986.JPG" />
-
<iframe width="420" height="315" src="http://www.youtube.com/embed/sTDqc6FylNc" frameborder="0" allowfullscreen></iframe></div>
+
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1996.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1999.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_1998.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2004.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2010.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2015.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2016.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2017.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2019.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2025.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2032.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2036.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2037.JPG" />
 +
<img src="http://www.bustack.com/wiki/fancybox/sucuk/IMG_2038.JPG" />
 +
 +
               
 +
            </div>
 +
            <div id="risorc" class="nivo-html-caption">
 +
                <strong>our</strong> research's pillars, <em> killing the legionella</em><a href="/Team:Baskent-Meds/Project">a link</a>.
 +
            </div>
 +
<div id="buk" class="nivo-html-caption">
 +
                <strong>Follows us </strong> in the <em>lab</em>, we are telling what we did <a href="/Team:Baskent-Meds/Notebook">a link</a>.
 +
            </div>
 +
<div id="mit" class="nivo-html-caption">
 +
                <strong>have</strong> we <em> met</em>? <a href="/Team:Baskent-Meds/Team">a link</a>.
 +
            </div>
 +
<div id="fan" class="nivo-html-caption">
 +
                <strong>also</strong> we have<em>fun!</em> with our competitors <a href="/Team:Baskent-Meds/Gallery">a link</a>.
 +
            </div>
 +
        </div>
 +
</div>
 +
    </div>
 +
      <div id="Layer1" class="style12" style="position:absolute; left:1px; top:821px; width:1103px; height:636px; z-index:3">
 +
        <script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
 +
<script>
 +
new TWTR.Widget({
 +
  version: 2,
 +
  type: 'profile',
 +
  rpp: 5,
 +
  interval: 30000,
 +
  width: 250,
 +
  height: 300,
 +
  theme: {
 +
    shell: {
 +
      background: '#ffffff',
 +
      color: '#ff4848'
 +
    },
 +
    tweets: {
 +
      background: '#ffe2e2',
 +
      color: '#310000',
 +
      links: '#ae0000'
 +
    }
 +
  },
 +
  features: {
 +
    scrollbar: false,
 +
    loop: false,
 +
    live: false,
 +
    behavior: 'all'
 +
  }
 +
}).render().setUser('iGEM_Baskent_MD').start();
 +
</script>
 +
 
 +
      </div>
 +
      <div id="Layer4" class="style13" style="position:absolute; left:261px; top:821px; width:843px; height:634px; z-index:4">
 +
        <p class="style14"><span class="style15">don't you dare!<br>
 +
            <span class="style14"><br>
 +
          our lightbox-like script is down, we are, certainly, lost in the dark!!! that's why this script and the first slider script looks like the same. however it's not! do you remember the Great philosopher Herakleitos(Heraclitus). he says you can not able to wash any part of anything second time in the same river; because river changes while human changes, vice versa.</span></span></p>
 +
        <p class="style14">for memory of Herakleitos and his wisdom...</p>
 +
      </div>
 +
      <script type="text/javascript">
 +
   
 +
$(window).load(function() {
 +
        $('#slider').nivoSlider();
 +
    });
 +
    </script>
</body>   
</body>   
</html>
</html>

Revision as of 03:07, 1 August 2012

Smooth Animated jQuery Menu

our research's pillars, killing the legionellaa link.
Follows us in the lab, we are telling what we did a link.
have we met? a link.
also we havefun! with our competitors a link.

don't you dare!

our lightbox-like script is down, we are, certainly, lost in the dark!!! that's why this script and the first slider script looks like the same. however it's not! do you remember the Great philosopher Herakleitos(Heraclitus). he says you can not able to wash any part of anything second time in the same river; because river changes while human changes, vice versa.

for memory of Herakleitos and his wisdom...