I thought the most impressive part about the html5 presentation wasn't necessarily the fact that it was HTML5. Its the fact that you can show working examples directly on the slide, they aren't simulated, they are just working javascript.

That didn't sink in for me right away. I was like whoa, this is all live javascript how the heck is Matt Nowack pulling this off in something like slideshare/etc. Then it clicked.

Very cool stuff.

Tip: use left/right arrow keys to move

Tip: Mobile devices may not have arrow keys. Making your website require them is not a great idea.

On the iPhone/iPad I found you can navigate the slides by one quick slide left or right.

Less like a tip, more like a requirement. Clicking to advance didn't work for me. :(

Browser Back/Forward buttons do nothing, scrollwheel does nothing, no overview/clickable index of links, annoying to scan...powerpoint is the future of webdev?

Quick thoughts: - Graceful degradation in HTML5 demos in general could definitely use some love - if you use a non-bleeding-edge Gecko-based browser (e.g. Flock), you get no functionality and no errors. Also, if your intended target audience is webdevs, why in the world would you require them to install chrome frame in IE? Just leave the first slide as is and we'll get it.

- Content nitpit: the slide about live() says "Efficient and concise way to provide client-side interaction". AFAIK, live events are slower than regular events, so calling them efficient seems wrong.

Some good examples there, but in all it's rather brief. Surely there's more to jQuery 1.4?

I'm getting quite weary of hearing that this or that is HTML5, and then you view it and there's really nothing in particular that you couldn't do with HTML 4.1. Is there something special and brand new about showing a set of slides with Javascript with a poor interface? With all of this hype and mislabeling, average semi-technical people are becoming confused from here to Zaire about HTML5. The comments on say, TechCrunch prove this thoroughly every time the topic is mentioned.

Interestingly it does use "section" and "header" elements, which are basically invisible to users but are also among the few "HTML5" features that actually fit the name.

Yeah, I saw it uses a few new elements. Still, you could accomplish the same effect without them, right? So it doesn't really require HTML5?

I guess what is supposed to be most striking is the horizontal slide show at [EDIT: that did not originally show for me in Safari 4.0.5]:

http://apirocks.com/html5/html5.html

Which didn't seem remarkable till around slide #31:

http://apirocks.com/html5/html5.html#slide31

- whose css-controlled number of columns ( -webkit-column-count: 3; ) I had never seen before.

EDIT: For real usability a TOC of the numerous slides + info on cross-browser testing would have added huge value.

Only the first slide was visible when viewed in Firefox 3.6.3 and Chrome 4.1... It's Hard to believe that something so unviewable made it to the front page of HN.

You have to push the right arrow key, it's a slide show. Sorry for not having better instructions, it's based off of the http://apirocks.com/html5/html5.html#slide1 presentation. The reason mouse clicks can't be used is because that would interfere with the JavaScript examples later on in the presentation.

Impressive work, Matthew! And I'm pleased it led me to your "Prosper" db front-end: looking forward to following its development. ...and to your use of "unlicense'd" (did i get right number/type of quotes?).

Thank you for your kind words, yes I believe that all of your quotes match up nicely. I can't take all the credit, this is based heavily on the apirocks HTML5 slideshow and on the amazing work Paul Irish did on the jQuery 1.4 Hawtness series, standing on the shoulders of giants.

I had no idea John Resig is so young! I was picturing a gandalf-like grey-beard who had been coding JS since before the internet. :P

Using the scroll wheel would be a nice touch:

  window.addEventListener("DOMMouseScroll",onwheel,false);

  function onwheel(event){
    var delta = -event.detail/3;
    if(delta>0){prevSlide();}
    else if(delta<0){nextSlide();}
    event.preventDefault();
    event.returnValue = false;
  }

It would be a nice accessibility feature to make it scale a bit better for browser zoom functions.

I'm sure this is an interesting presentation for me, but I've tried the latest versions of IE, FireFox, and Chrome, and at best I get an overly kludgy interface.

Please repost in some better format. Thanks

Would be nice to have a small menu in a corner or a custom right click context menu which has "Jump To/Previous/Next" type options.

Also a option for it to full the whole screen area would be awesome.

I saw pretty crazy behavior regarding the back button, at least in FF 3.5.9. It put many elements in my history, none of which actually took me anywhere.

Great stuff. I forked it on GitHub and added support for [tab] cause it messed up the whole thing. Now it advances to the next slide.

Linkage would be nice, So we can all marvel in the wonderful stuff being done with this.

checkout the clean html source code.

HTML Tidy finds 21 errors and 3 warnings.

I like Eric Meyer's S5 template for clean markup and slick interface: http://meyerweb.com/eric/tools/s5/

Tried it in FF 3.6.3 and safari - no arrows, can't advance anywhere.

did too and was lost because I don't know where to click. not "human" friendly.

In Safari I'm unable to advance to a new slide.

doesn't solve fundamental powerpointitis problem

slide 10+ have their content missing

are you viewing in FF? I am and noticed some of the logos aren't displaying - but they do in Chrome. Nice presentation, but "HTML5" shouldn't mean "webkit only".

Safari