In my previous post, Making HTML5 Video work on Android phones, I said that you have to encode your videos as .m4v in order for them to work in Android. This isn’t actually correct. The suffix can be either .mp4 or .m4v, what matters is the way the video is encoded.
Now, there are loads of blog and forum posts which give differing advice on presets and parameters, and I’m no expert — so what I’ll do is just show you two quick ways that worked for me (I have a Samsung Galaxy S). Note: the other two requirements from my previous blog post still stand.
Read the rest of this post
I recently became the owner of an Android phone* and found that, despite it being listed as a feature of the browser, the HTML5 video element didn’t work for almost all of the examples I tried. I’ve just done some experimentation with this and think I’ve found a solution, so this post is offered in the hope that it helps anyone who may be tearing their hair out over the same problem.
Read the full article
My last post was about using SVG values for the background-image property, and I pointed out one big problem with the technique:
The drawback of this is that it’s not ready for use just yet — browsers that don’t support SVG in background-image will not provide any fallback, even if you supply another background-image value; so in non-supporting browsers, no image at all will be displayed.
This was annoying me a little, and I couldn’t find any workarounds that didn’t use JavaScript. However, after a bit of head-scratching I’ve come up with a way to get around it.
Read the full article
While having a look through the list of features for developers planned for Firefox 4 earlier today, I noticed this:
You can now use SVG with the img element, as well as the background image in CSS.
I know you can already use SVG in background-image with Safari, Chrome and Opera, and this, coupled with Internet Explorer’s push towards SVG and the strong chance this will be available in IE9, made me decide to take a closer look.
Read the full article
I hope you’ll forgive a little self-promotion, as I’d just like to play a few quick notes on my own trumpet. The latest issue of Net magazine is now on sale, and features a tutorial article, Create A Dynamic Content Panel, written by me.
In the article I explain how to build a dynamic Contact area, as we did on our recent redesign of Preloaded.com, using the Web Storage API and the BBC’s Glow Javascript library.
I’m not sure what the rights situation is with this article, but I hope that at some point in the future I’ll be able to post it here on my blog. But in the meantime, you can buy a copy of Net magazine in the UK at all good newsagents, as the saying goes (I don’t know if it will be in overseas editions also).
On the subject of print, I’m also currently writing a book about CSS3 which should be published later this year. I’ll have more information on that nearer the time.
The latest nightly releases of what will become Firefox 4 have implemented a couple of experimental new CSS features. The –moz-calc function allows calculations on length values, and the :-moz-any selector permits grouping of simple selectors.
If you have a nightly build of Firefox you can see a little demo I’ve put together of them in action.
Read the full article
Last year I wrote a post (Building HTML5 video controls with JavaScript) introducing the HTML5 Media Elements API and demonstrating a simple set of controls for playing video.
In this (somewhat belated) follow-up I’m going to explore building a more interactive set of controls using a JavaScript UI library; I’m going to use Glow, but it could easily be adapted to jQuery UI or similar.
Read the full article