Difference between revisions of "User:Anita Nguyen"

From OpenWetWare
Jump to: navigation, search
Line 12: Line 12:
 
*[[OpenWetWare:Welcome|Introductory tutorial]]
 
*[[OpenWetWare:Welcome|Introductory tutorial]]
 
*[[Help|OpenWetWare help pages]]
 
*[[Help|OpenWetWare help pages]]
 +
 
<html>
 
<html>
 
<head>
 
<head>
 +
 
<script type="text/javascript" src="jquery.js"></script>
 
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
+
<script type="text/javascript">  
 
$(document).ready(function(){
 
$(document).ready(function(){
  $("button").click(function(){
+
$(".flip").click(function(){
     $(this).hide();
+
     $(".panel").slideToggle("slow");
 
   });
 
   });
 
});
 
});
 
</script>
 
</script>
 +
 +
<style type="text/css">
 +
div.panel,p.flip
 +
{
 +
margin:0px;
 +
padding:5px;
 +
text-align:center;
 +
background:#e5eecc;
 +
border:solid 1px #c3c3c3;
 +
}
 +
div.panel
 +
{
 +
height:120px;
 +
display:none;
 +
}
 +
</style>
 
</head>
 
</head>
 
+
 
<body>
 
<body>
<button>Click me</button>
+
 +
<div class="panel">
 +
<p>Because time is valuable, we deliver quick and easy learning.</p>
 +
<p>At W3Schools, you can study everything you need to learn, in an accessible and handy format.</p>
 +
</div>
 +
 +
<p class="flip">Show/Hide Panel</p>
 +
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 09:23, 7 September 2010

Contact Info

OWWEmblem.png

Education

Useful links

<html> <head>

<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".flip").click(function(){

   $(".panel").slideToggle("slow");
 });

}); </script>

<style type="text/css"> div.panel,p.flip { margin:0px; padding:5px; text-align:center; background:#e5eecc; border:solid 1px #c3c3c3; } div.panel { height:120px; display:none; } </style> </head>

<body>

<div class="panel"> <p>Because time is valuable, we deliver quick and easy learning.</p> <p>At W3Schools, you can study everything you need to learn, in an accessible and handy format.</p> </div>

<p class="flip">Show/Hide Panel</p>

</body> </html>