Biomod/2011/IITM/AcidArtists

From OpenWetWare

< Biomod | 2011(Difference between revisions)
Jump to: navigation, search
Current revision (22:41, 25 May 2012) (view source)
(Undo revision 604268 by Nikhil Srinivasan (Talk))
 
(39 intermediate revisions not shown.)
Line 9: Line 9:
ul.polaroids li { display: inline; }
ul.polaroids li { display: inline; }
ul.polaroids a{display: inline; float: left; margin: 0 0 27px 30px; width: auto; padding: 10px 10px 15px; text-align: center; font-family: "Marker Felt", sans-serif; text-decoration: none; color: #333; font-size: 18px;  -webkit-transform: rotate(-2deg); -webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); }
ul.polaroids a{display: inline; float: left; margin: 0 0 27px 30px; width: auto; padding: 10px 10px 15px; text-align: center; font-family: "Marker Felt", sans-serif; text-decoration: none; color: #333; font-size: 18px;  -webkit-transform: rotate(-2deg); -webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); }
-
ul.polaroids img { display: block; width: 190px; margin-bottom: 12px; -webkit-transform: rotate(-2deg); -webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); }
+
ul.polaroids img { display: block; width: 220px; margin-bottom: 12px; -webkit-transform: rotate(-2deg); -webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); }
#content{
#content{
Line 29: Line 29:
-
body{
 
-
background:url('http://openwetware.org/images/2/23/Grunge_Backgrounds.png');
 
-
color:#333;;
 
-
}
 
h1, h2, h3, h4, h5, h6, p, a, pre{color:#333;; font-family: 'Trebuchet MS', Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6, p, a, pre{color:#333;; font-family: 'Trebuchet MS', Helvetica, sans-serif;}
Line 101: Line 97:
}
}
-
.picture{width:150px;}
+
.picture{width:200px;}
ul.polaroids a:after {
ul.polaroids a:after {
Line 160: Line 156:
position:fixed;
position:fixed;
top:8%; left:13%;
top:8%; left:13%;
 +
display:none;
 +
width:80%;
 +
color:white;
 +
z-index:101;
}
}
Line 177: Line 177:
         $el.animate({paddingTop: '35'});   
         $el.animate({paddingTop: '35'});   
     },function(){   
     },function(){   
-
    $('.stack li a').hover(function(){ 
 
-
        $("img",this).animate({width: '56px'}, 100); 
 
-
        $("span",this).animate({marginRight: '30px'}); 
 
-
    },function(){ 
 
-
        $("img",this).animate({width: '50px'}, 100); 
 
-
        $("span",this).animate({marginRight: '0'}); 
 
-
    });  function(){ 
 
         var vertical = 0;   
         var vertical = 0;   
         var horizontal = 0;   
         var horizontal = 0;   
Line 195: Line 188:
           .find('li a>img').animate({width: '50px', marginLeft: '9px'}, openspeed);   
           .find('li a>img').animate({width: '50px', marginLeft: '9px'}, openspeed);   
         $el.animate({paddingTop: '0'});   
         $el.animate({paddingTop: '0'});   
-
     }
+
     });
 +
 
 +
    // Stacks additional animation 
 +
    $('.stack li a').hover(function(){ 
 +
        $("img",this).animate({width: '56px'}, 100); 
 +
        $("span",this).animate({marginRight: '30px'}); 
 +
    },function(){ 
 +
        $("img",this).animate({width: '50px'}, 100); 
 +
        $("span",this).animate({marginRight: '0'}); 
 +
    }); 
});   
});   
Line 206: Line 208:
         $el.next().children().each(function(){   
         $el.next().children().each(function(){   
             $(this).animate({top: '-' + vertical + 'px', left: horizontal + 'px'}, openspeed);   
             $(this).animate({top: '-' + vertical + 'px', left: horizontal + 'px'}, openspeed);   
-
             vertical = vertical + 55;   
+
             vertical = vertical + 75;   
             horizontal = (horizontal+.75)*2;   
             horizontal = (horizontal+.75)*2;   
         });   
         });   
Line 217: Line 219:
var name;
var name;
$(".picture").click(function(){
$(".picture").click(function(){
-
name="#"+
+
name="#"+$(this).attr("title");
$("#data_container").fadeIn();
$("#data_container").fadeIn();
-
$("#video").fadeOut();
+
$(name).fadeIn();
});
});
$("#close_dialog").click(function(){
$("#close_dialog").click(function(){
$("#data_container").fadeOut();
$("#data_container").fadeOut();
 +
$(name).fadeOut();
});
});
Line 235: Line 238:
<img src="http://openwetware.org/images/0/09/Iitm-acidartists-banner.jpg"/>
<img src="http://openwetware.org/images/0/09/Iitm-acidartists-banner.jpg"/>
<br/><br/>
<br/><br/>
-
<div id="pics" style="float:left;" align=center>
 
-
<ul class="polaroids" style="list-style:none;" align=center>
 
-
<li><a href="#"><img class="picture" src="http://openwetware.org/images/a/ad/DNA_origami_iitm.png" title="introduction"/></a></li>
 
-
<li><a href="#"><img class="picture" src="http://openwetware.org/images/6/67/Play_icon.png" title="video"/></a></li>
 
-
<li><a href="#"><img class="picture" src="http://openwetware.org/images/9/97/Project_iitm.png" title="project"/></a></li>
 
-
<br/>
 
-
<li><a href="#"><img class="picture" src="http://openwetware.org/images/5/51/Dollar_iitm.png" title="sponsers"/></a></li>
 
-
</ul>
 
-
</div>
 
Line 249: Line 243:
<img src="http://openwetware.org/images/9/9f/Stack.png" alt="stack">   
<img src="http://openwetware.org/images/9/9f/Stack.png" alt="stack">   
<ul id="stack">   
<ul id="stack">   
-
<li><a href=""><span>Reference Papers</span><img src="http://openwetware.org/images/1/13/Papers.png" alt="Papers"></a></li>
+
<li><a href="http://openwetware.org/wiki/Biomod/2011/IITM/AcidArtists/Sponsors"><span>Sponsors</span><img class="picture" src="http://openwetware.org/images/5/51/Dollar_iitm.png" title="sponsors"/></a></li>
-
<li><a href=""><span>Brain Stroming</span><img src="http://openwetware.org/images/3/3f/Brain.png" alt="Brain Storming"></a></li>   
+
<li><a href="http://openwetware.org/wiki/Biomod/2011/IITM/AcidArtists/Reference_papers"><span>Reference_Papers</span><img src="http://openwetware.org/images/1/13/Papers.png" alt="Papers"></a></li>   
-
<li><a href=""><span>Work Diary</span><img src="http://openwetware.org/images/2/2a/Diary.png" alt="Work diary"></a></li>   
+
<li><a href="http://openwetware.org/wiki/Biomod/2011/IITM/AcidArtists/Team"><span>Team</span><img src="http://openwetware.org/images/6/62/Team_iitm.jpg" alt="Team"></a></li>   
-
<li><a href=""><span>Team</span><img src="http://openwetware.org/images/6/62/Team_iitm.jpg" alt="Team"></a></li>   
+
<li><a href="http://openwetware.org/wiki/Biomod/2011/IITM/AcidArtists/Project"><span>Project</span><img src="http://openwetware.org/images/f/f0/Home-sm.png" alt="Project"></a></li>   
-
<li><a href=""><span>Project</span><img src="http://openwetware.org/images/f/f0/Home-sm.png" alt="Project"></a></li>   
+
<li><a href="http://openwetware.org/wiki/Biomod/2011/IITM/AcidArtists/DNA_Nanotech"><span>Introduction</span><img src="http://openwetware.org/images/a/ad/DNA_origami_iitm.png" alt="Introduction"></a></li>   
</ul>   
</ul>   
</div>   
</div>   
 +
Line 261: Line 256:
<div id="menu_desc" style="position:fixed; right:-38px; width:200px; text-align:center; bottom:36px; color:white; cursor:pointer"><b>Menu</b></div>
<div id="menu_desc" style="position:fixed; right:-38px; width:200px; text-align:center; bottom:36px; color:white; cursor:pointer"><b>Menu</b></div>
-
<div id="data_container" style="border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; position:fixed; width:80%; left:10%; height:90%; top:5%; background:black; opacity:0.95; z-index:100; display:none;" >
+
<iframe width="800" height="450" src="http://www.youtube.com/embed/ZnnSuNb9A14?rel=0&amp;hd=1" frameborder="0" allowfullscreen></iframe>
-
<div id="close_dialog" style="position:absolute; top:7px; right:15px; cursor:pointer; color:white;">close <b>X</b></div>
+
-
</div>
+
-
<iframe class="stuff_contents" style="display:none;" id="video" width="640" height="360" src="http://www.youtube.com/embed/ZnnSuNb9A14?rel=0&amp;hd=1" frameborder="0" allowfullscreen></iframe>
 
</body>
</body>
</html>
</html>

Current revision



Personal tools