JavaScript libraries like jQuery and Prototype are amazing; flexible and powerful, they standardise processes and make cross-browser scripting really easy. I rarely work on a project nowadays where a library isn’t used.
Their ease-of-use has a slight drawback, however: it’s easy to rely on them too much, and lose sight of new developments in JavaScript. This was the reason for my not really paying much attention to an exciting recent introduction, the Selectors API, until I had cause to use it on a personal project.
I’m having a bit of a love affair with jQuery, the Javascript library, at the moment. I know my way around JS but am far from an expert, so jQuery’s simple syntax is a godsend for me, and provides huge savings in my development time.
One quick technique I used yesterday was to make three elements of equal height; it’s very simple and won’t cope with dynamic content, but is perfectly suitable for simple page layouts.
Recently I was chatting with Rapha Martins, and he mentioned a feature he’d like to see in CSS: a ‘default’ value for properties; that is, if you change the value of a property, a keyword that would change it back to the browser default rather than you having to specify that value again.
That has been proposed for CSS 3, with the ‘initial’ value, and it’s been introduced into the latest preview of Firefox 3 (Gran Paradiso), with the browser-specific –moz– prefix. I’ve put together a quick couple of basic examples of how it will work (you will, obviously, need the latest preview to see them).
I’m back from my holiday, with a quick look at some of the links I would have discussed in more detail had I been here…
One technology that’s ready to take the step up onto the big stage is SVG. If you’re not sure what that is, its Wikipedia entry provides a good summary:
SVG is an XML markup language for describing two-dimensional vector graphics, both static and animated.
That’s a pretty big deal; static or animated images which are marked up with XML, meaning you can use the DOM to manipulate them. Interactive images; imagine the possibilities!
Gecko is the rendering engine used in browsers such as Firefox, SeaMonkey, Camino, Epiphany, Netscape, and more.
The next version (1.9, currently available as a preview release) introduces a whole load of new features and fixes to the engine. In my last post I mentioned the speed increase thanks to the move to a new graphics layer and changes to rendering order, as well as support for the APNG format and fixes to the CSS to allow it to pass the Acid2 test. But there’s more. Here are some new features of interest to developers:
For no particular reason other than idle curiosity, I made a demo of a broken neon sign, using CSS Animations (you’ll need Firefox 5, Safari or Chrome to see it). It doesn’t degrade well at the moment, the root cause of which is down to what I think is a bug in Firefox’s implementation — I’ll need to confirm that.
One quick learning from making this: it would be really useful to have CSS Mixins when using a lot of repetitive keyframes, as I do in this animation. The W3C seem to be quite against them, however.
[#] 3 Comments