Opera 21 released

Opera 21 for Mac and Windows (based on Chromium 34) is out! Here’s what that means for web developers.

<img srcset>

The srcset attribute, to be used on its own or in conjunction with the upcoming <picture> element is now implemented. For now, only its x syntax, which causes a different resource to be loaded and rendered based on the pixel density of the device, is supported. Here’s a simple example:

<img alt="A unicorn gazes into a magical enchanted mirror." src="unicorn@1x.jpg" srcset="unicorn@2x.jpg 2x, unicorn@3x.jpg 3x">

Until srcset is fully supported in all browsers, you may want to use Picturefill which acts as a polyfill for srcset (and <picture>, too!).

Unprefixed Element.prototype.matches()

Opera previously supported the Element.prototype.webkitMatchesSelector() method. We now support the standardized and unprefixed name for it, i.e. Element.prototype.matches().

var element = document.querySelector('.foo .bar');
element.matches('input');
// → `true` if `element` is an `input` element, else `false`

Controlling ligatures in text through CSS

Opera now supports the font-variant-ligatures CSS property, which makes it possible to define what kinds of ligatures and contextual forms to use when rendering text. Looking for a demo? Check out Eric Meyer’s test case.

If you’re interested in experimenting with features that are in the pipeline for future versions of Opera, we recommend following our Opera Developer stream.