background preloader

Video for Everybody!

Video for Everybody!
Video for Everybody is simply a chunk of HTML code that embeds a video into a website using the HTML5 <video> element, falling back to Flash automatically without the use of JavaScript or browser-sniffing. It therefore works in RSS readers (no JavaScript), on the iPhone / iPad (don’t support Flash) and on many browsers and platforms. Thanks to the rapid adoption of HTML5 video happening right now, Video for Everybody isn’t the only solution around. It is not a neatly packaged, fully-featured solution for those unfamiliar with HTML. VfE is for developers who either want something really simple they can quickly use on their blog or websites, or as a good starting point to develop their own custom solution. It does not use JavaScript. How It Works If your browser supports it, HTML5 video is used. If HTML5 video is not supported, Adobe Flash is used. Finally, if all else fails, a placeholder image is shown and the user can download the video using the links provided. VfE The Code Using Video

deIgniter Base Classes: Keeping it DRY Most applications in CodeIgniter will have various types of pages. The public frontend, a backend admin panel, perhaps some sort of moderator or staff panel, etc. Logic for these types of pages is normally copied between all of their different Controllers which means, for example, if the way the admin area protection is handled is changed there will be lots of Controllers to change and test. This logic can instead be shared by some creative extending of the Controller class to create custom Base Controllers like Public_Controller, Admin_Controller, etc. Base64, model trains, Web Workers & the DOM, captions, … Inspired by my friend Peter who writes summaries about the ongoing progress with WebKit I thought I should try writing such a summary about the WHATWG. If this works out you might see another one. Obviously a lot has been happening thus far so to not make this ridiculously hard I will restrict myself to everything that happened fairly recently. Aryeh Gregor took it upon himself to write a specification for window.btoa and window.atob. These methods originate with Gecko and have been adopted by other browsers since, but have never been formally specified.

tubular, a YouTube Background Player jQuery Plugin Video controls:Play | Pause | Volume Up | Volume Down | Mute Tubular is a jQuery plugin that lets you set a YouTube video as your page background. Just attach it to your page wrapper element, set some options, and you're on your way.

HTML5Rocks - "Offline": What does it mean and why should I care? Introduction: The Meaning of "Offline" "Web" and "online" are two closely associated terms, downright synonymous to many people. So why on earth would we talk about "offline" web technologies, and what does the term even mean? At one level, we can talk about completely offline web apps, those unusual creatures that run inside a browser, but never see the light of the internet. Working with RESTful Services in CodeIgniter CodeIgniter is becoming well known for its power as a PHP based web application framework, but it's not often that we see examples of it being used for anything else. Today we'll learn how we can use CodeIgniter to create a RESTful API for your existing web applications, and demonstrate how to interact with your own API or other RESTful web-services, such as Facebook and Twitter. Program: CodeIgniter, CodeIgniter REST server and CodeIgniter REST client Difficulty: MediumEstimated Completion Time: 30 minutes If you have been following the CodeIgniter From Scratch series you will know by now that it is relatively quick and easy to put together simple web applications, such as blogs, CMS systems, brochure sites, etc.

Applying a Clean & Imageless Design to an Article – Part I For Christmas this year, my beautiful wife gave me a copy of The Web Designer’s Idea Book, Volume 2. Obviously, I have been perusing the book, and I am finding that there are tons of awesome web designs to take in. I’m super happy with the gift and I expect that it will prove to be a highly valuable resource throughout 2011, and beyond. HTML 5 Video 'Full-Screen' A few days ago I was playing around with HTML 5 and it’s new (popular) video tag! The result in short: I love(d) it! Getting it to work in all the major browsers wasn’t that hard at all. I didn’t even use nasty JavaScript hacks for that, just some basic mark-up fallbacks. But.. I missed a functionality in all the video players: A full-screen mode.

20 Amazing Experimental Projects from Mozilla Demo Studio(CSS3,HTML5….) We have published a few posts about experimental CSS3 and HTML5 to show the power of them.And you know,new projects are being released so often and personally i like to check out these new experiments.This time we are showcasing (mostly fresh) projects developed using CSS3,HTML5 and Javascript from Mozilla Demo Studio. Mozilla Demo Studio,where developers can develop,share,demonstrate, and learn all about Web technologies.You can also download the source codes to see how they work. The Letter-Heads The letter-heads is an interactive shadow-art in your browser.Built using JavaScript, CSS3, Audio, Fonts & TypeDemo | Get The Code The Planetarium

A Quick Code Igniter and JQuery Ajax Tutorial This tutorial assumes a basic working knowledge of Code Igniter. If you have never used CI before, please refer to the framework documentation In the old days (2 years ago), working the Javascript magic to create a cool AJAX based event took a fairly decent working knowledge of the mechanisms behind the process. With the increasing popularity of Javascript libraries however, this type of functionality became available to the web site hobbyist, and was made much easier for the web site professional.

Go offline with application cache UPDATE 15 June 2011: .appcache is now the recommended file extension for cache manifests. Please ensure you update your filename, manifest attribute on the html element and set the correct mime-type in your server config. HTML5 introduces new methods for enabling a web site or web application to function without a network connection.

ci + jquery I just use “load” with Code Igniter’s site_url() function. Here’s the javascript (after loading in jQuery of course): $(document).ready(function() { $("#submitit").click(function() { Here’s the form and ajax div: The Bright (Near) Future of CSS - Smashing Magazine Advertisement This article is an excerpt from Eric Meyer’s recent book Smashing CSS1, published by Wiley in cooperation with Smashing Magazine. In this article, the focus is on what’s coming: styling techniques you’ll use in the immediate and near-term future. From styling HTML 5 elements to rearranging layout based on display parameters to crazy selection patterns to transforming element layout, these are all techniques that you may use tomorrow, next month, or next year.

Guidelines on ALT texts in IMG elements In HTML authoring, there are very good reasons to include an alt attribute into every img element. The purpose is to specify a textual replacement for the image, to be displayed or otherwise used in place of the image. Thus, the prime rule is: Consider what the page looks like or sounds like when images are not shown. Then, write for each image an alt text that best works as a replacement. This document also gives more specific suggestions for simple, common situations, and some uncommon too.