Skip to content


Subversion checkout URL

You can clone with
Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

92 lines (68 sloc) 2.23 KB
<!DOCTYPE html>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Tests for hiding/showing elements</title>
<style type="text/css">
.section {
border: 1px solid #CCC;
padding: 2em;
margin: 2em;
.test {
padding: 2em;
margin: 2em 0 0;
width: 300px;
background: #CCF;
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
-webkit-box-shadow: 0 0 5px #000;
-moz-box-shadow: 0 0 5px #000;
box-shadow: 0 0 5px #000;
behavior: url(../build/;
<script type="text/javascript">
function toggleDisplay( id ) {
var el = document.getElementById( id ); = === 'none' ? 'block' : 'none';
function toggleVisibility( id ) {
var el = document.getElementById( id ); = === 'hidden' ? 'visible' : 'hidden';
<h1>Tests for hiding/showing elements</h1>
<div class="section">
<h2>Toggle display, hidden initially</h2>
<button type="button" onclick="toggleDisplay('test1')">Toggle</button>
<div class="test" id="test1" style="display:none;">
Hello PIE
<div class="section">
<h2>Toggle display, shown initially</h2>
<button type="button" onclick="toggleDisplay('test2')">Toggle</button>
<div class="test" id="test2">
Hello PIE
<div class="section">
<h2>Toggle visibility, hidden initially</h2>
<button type="button" onclick="toggleVisibility('test3')">Toggle</button>
<div class="test" id="test3" style="visibility: hidden">
Hello PIE
<div class="section">
<h2>Toggle visibility, shown initially</h2>
<button type="button" onclick="toggleVisibility('test4')">Toggle</button>
<div class="test" id="test4">
Hello PIE
Jump to Line
Something went wrong with that request. Please try again.