Skip to content

Commit dca9747

Browse files
committed
add hidden test
1 parent 22acbae commit dca9747

File tree

2 files changed

+21
-0
lines changed

2 files changed

+21
-0
lines changed

demos.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,16 @@
99
},
1010
"test": "typeof FileReader != 'undefined' && 'draggable' in document.createElement('span') && !!window.FormData && 'upload' in new XMLHttpRequest"
1111
},
12+
{
13+
"desc": "Hidden property",
14+
"url": "hidden",
15+
"tags": "hidden",
16+
"support": {
17+
"live": "chrome firefox opera safari",
18+
"nightly": ""
19+
},
20+
"test": "'hidden' in document.createElement('i')"
21+
},
1222
{
1323
"desc": "Simple class manipulation",
1424
"url": "classlist",

demos/hidden.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<title>Hidden</title>
2+
<style>
3+
.fail { background: #c00; padding: 2px; color: #fff; }
4+
</style>
5+
<article>
6+
<p>Welcome dear HTML5-er. You will be able to read this paragraph, but not the next. The next paragraph has the hidden property set on it. It's a boolean that uses the browsers own stylesheet to hide the element, which is nicer than having to dip in to the <code>style</code> properties in JavaScript.</p>
7+
<p id="test" class="fail">Sadly, your browser doesn't support the hidden property. Useful when you want to quickly do <code>element.hidden</code>. Ah well, back to CSS.</p>
8+
</article>
9+
<script>
10+
document.getElementById('test').hidden = true;
11+
</script>

0 commit comments

Comments
 (0)