Bruce Lawson by Bruce Lawson in Blog

Post tags: odin opera-12

This post is licensed under a Creative Commons Attribution 3.0 Unported license.

Hello Opera 12!

Twelve is a fascinating number, full of symbolism: there are twelve months in a year, twelve signs of the zodiac, twelve labours of Hercules, twelve cranial nerves in humans and — as every schoolchild knows — the number 12 has a perfect number of divisors, and the sum of its divisors is also a perfect number. 12 is therefore one of the two known mathematical sublime numbers. Talking of sublime — hello Opera 12!

Shiny demos!

In order to celebrate Opera 12 being released into the wild, we've made a website full of shiny demos for you to play with. Tatami mats? Got 'em. A Hixie Keyboard, madam? Step right up! A 1980s style SVG based inbox attack LED game? Why, of course, sir! A hipster dog riding a penny-farthing and bumping into giant shoes? Like, totally, dude!

Naturally, no browser is blocked, so come one and all, with desktop, tablets or mobile and, if your browser supports all the features, see the shiny!

Hardware acceleration and WebGL support

We're aiming to make Opera entirely hardware accelerated, from the UI to all page rendering and painting (with support for OpenGL as well as DirectX backends), but for now, both HWA and WebGL are turned off by default. You can enable them by setting opera:config#UserPrefs|EnableWebGL and opera:config#UserPrefs|EnableHardwareAcceleration to 1, then saving and restarting the browser.

If you're interested in trying out a WebGL demo, check out Emberwind; if you want to start coding WebGL, have a look at our WebGL articles.

CSS3 Animations and more animatable properties

Opera 12 supports CSS3 keyframe animations. For the moment, they're prefixed. The CSS Working Group recently resolved that animations, transitions and transforms may be released unprefixed. We completely agree with this resolution. However, this decision was made too close to the release for us to change the code without risking bugs/ regressions. We'll very soon remove prefixes for animations, transforms and transitions.

For now, please use -o- prefixes on the relevant CSS properties: -o-animation , -o-animation-delay, -o-animation-direction, -o-animation-duration, -o-animation-fill-mode, -o-animation-iteration-count, -o-animation-name, -o-animation-play-state and -o-animation-timing-function. Also note that you also need to prefix the CSS @keyframes directive, too: @-o-keyframes.

We've also expanded our support for animatable properties (animatable using CSS3 transitions as well as CSS3 animations.)

Learn more:

Generated Content for Paged Media

The CSS Generated Content for Paged Media Module is a spec spearheaded by our CTO Håkon Wium Lie, and it allows you to create a page-like browsing experience on web pages by adding a few lines of CSS to your content. Opera 12 partially implements the spec, which you can try out using Håkon's examples.

Tip: On touch screen devices, try swiping the pages left and right. On non-touch screens use your mouse's horizontal scrolling mechanism to move to the next page, or try PageUp/Down.

Camera support with getUserMedia

Opera Mobile 12, and now Opera 12 desktop, implement camera access with the getUserMedia specification. If you want to get started with building stuff, check out our getUserMedia article. For demo fun, check out our Shiny demos.

CORS

Opera 12 supports cross-origin resource sharing, also known as CORS. If you want to learn how to use this in your site, check out our Dev.Opera article about it: DOM access control using cross-origin resource sharing.

Drag and Drop

HTML5 includes the Drag and Drop API, which gives us the ability to natively drag, drop, and transfer data to HTML elements, and now this is supported in Opera 12 as well. Read how to use HTML5 Drag and Drop.

XMLHttpRequestUpload interface

Opera 12 implements progress events in XMLHttpRequest, for upload, download, and timeout updates:

We also have Blob/FormData support for the same.

Updated Windows & Tabs extension API

Opera 12 updates the Windows & Tabs API, for which we have published updated documentation. Be sure to read through it if your existing Opera extension relies on it, and feel free to ask questions in the comment section on the API pages.

Discontinuation of Unite and Widgets

Previously, we announced that we're discontinuing Unite and Widgets in Opera 12, but at the same time are going full steam ahead with our extensions platform. For those who want to convert their existing widgets to extensions, we've produced an article to help you with the conversion process.

Themes

If you want to spice up your browsing experience, with, let's say, a cookie monster-themed browser UI, be sure to check out our new themes catalog. Making themes is super easy, and the nitty-gritty details of Opera 12's new theming infrastructure are explained in our Opera's lightweight themes article.

Monitor Opera's CPU use

Got a tab that's hogging CPU cycles? Is your machine's fan whirring so hard that it's hovering a centimeter above your desk? Identify the culprit with opera:cpu.

Enjoy!

We're confident your browsing experience will be better than ever with Opera 12. Our product specs overview page gives an overview of what is supported where in all recent Opera products.

The only other known sublime number is 6086555670238378989670371734243169622657830773351885970528324860512791691264 which, by an amazing co-incidence, is the number of empty coffee cups piled up outside our Core Programming Department's door. Makes you think, doesn't it?