Need help with html5demos?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

remy
4.7K Stars 1.9K Forks MIT License 199 Commits 53 Opened issues

Description

Collection of hacks and demos showing capability of HTML5 apps

Services available

!
?

Need anything else?

Contributors list

# 1,484
CSS
HTML
javascr...
angular...
154 commits
# 25,001
HTML
openshi...
revealj...
Kuberne...
2 commits
# 164
Shell
dotfile...
ecmascr...
Angular
2 commits
# 144,643
HTML
PHP
Shell
arch-li...
2 commits
# 180
CSS
perform...
chrome-...
javascr...
2 commits
# 191,984
Shell
HTML
PHP
1 commit
# 13,587
JavaScr...
Shell
TeX
collabo...
1 commit
# 15,804
w3c
js
Electro...
flash
1 commit
# 69,605
HTML
Chrome
Shell
chrome-...
1 commit
# 72,443
securit...
interop...
jQuery
Sass
1 commit
# 48,240
textboo...
PHP
React
atomic-...
1 commit
# 158,120
PHP
slug
Laravel
eloquen...
1 commit
# 189,130
HTML
PHP
Shell
netdata
1 commit
# 65,585
Python
Shell
interfa...
PHP
1 commit
# 19,354
Zsh
shell-s...
Bash
bible
1 commit

HTML5 Demos and Examples

A collection of HTML5 experiments I've created, now open source and on GitHub, so please go ahead and help me hack this resource in to a wealth of demos that other authors can learn from.

🚨 THIS PROJECT IS NOW RETIRED - YOU WILL FIND WORKING CODE, BUT IT IS NO LONGER LIVE OR MAINTAINED 🚨

Aim

  • If a user can hit view source on the demo, then we've done our job
  • Where possible browser support should be named (FF3.5, etc)
  • All content is open source and content is Creative Commons Share Alike 2.0
  • Individual demos, if authored by someone other than @rem can be credited as appropriate

Creating new demos

If the demo should take the default style - currently grey and dull - but it keeps the focus on the code ;) then follow these instructions. Otherwise, simply create the file in the root directory calling it [yourdemo].html and include it in the index.php.

Instructions to creating a new demo:

  • Create a .html in the /demos directory
  • Use the following template (also a sample in /demos/template.html):
<title><!-- Title of your demo, note this appears in the document title prefixed with "HTML5 Demo:" --></title>
<style>/** any custom styles live here **/</style>
<article><!-- any demo markup here --></article>
<script>
// your JavaScript
</script>
  • When requesting the demo, use html5demos.com/[yourdemo] and page.php will top and tail your page
  • Any additional JavaScript libraries should be stored in the /js directory, assets, such as video and audio live in the /assets directory.

That should be it.

By submitting any code, you're also agreeing that your code is covered by the MIT-LICENSE that this project is covered by, and all content is covered by Creative Commons Share Alike 2.0 - as is all of this project: it's all about sharing baby!

TODO

Demos Required

  • Microdata
  • SVG
  • More audio and video demos
  • More introductions to canvas
  • More event based stuff
  • WebSockets (@rem - have a demo ready, but not the server side)

Misc

  • Clearer versioning on the demos, rather than "All bar Opera", should include last version to support feature, i.e. Opera 10.10b, Chrome 4 dev, Safari 4.0, etc.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.