add hidden test
This commit is contained in:
parent
22acbae5d3
commit
dca97471a4
10
demos.json
10
demos.json
|
@ -9,6 +9,16 @@
|
|||
},
|
||||
"test": "typeof FileReader != 'undefined' && 'draggable' in document.createElement('span') && !!window.FormData && 'upload' in new XMLHttpRequest"
|
||||
},
|
||||
{
|
||||
"desc": "Hidden property",
|
||||
"url": "hidden",
|
||||
"tags": "hidden",
|
||||
"support": {
|
||||
"live": "chrome firefox opera safari",
|
||||
"nightly": ""
|
||||
},
|
||||
"test": "'hidden' in document.createElement('i')"
|
||||
},
|
||||
{
|
||||
"desc": "Simple class manipulation",
|
||||
"url": "classlist",
|
||||
|
|
|
@ -0,0 +1,11 @@
|
|||
<title>Hidden</title>
|
||||
<style>
|
||||
.fail { background: #c00; padding: 2px; color: #fff; }
|
||||
</style>
|
||||
<article>
|
||||
<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>
|
||||
<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>
|
||||
</article>
|
||||
<script>
|
||||
document.getElementById('test').hidden = true;
|
||||
</script>
|
Loading…
Reference in New Issue