Skip navigation.

exploreopera

| Help

Sign up | Help

Posts tagged with "css"

Google maps and event transparency

, , , ...

If you use Google Maps with Opera 9 betas you have probably noticed that the top left navigation does virtually nothing. Only the slider works at the moment.

Technically, they use an empty element that is styled to cover the graphic to catch mouse events and call the navigation actions. (Don't ask me why it is coded like that, and why for example the graphic isn't the background of the DIV so that this problem doesn't arise).

This not working in Opera is caused by our experimental support for event transparency.

At first sight I thought I had missed something in IE's implementation that would make Google Maps work. However, none of my tests could identify the missing piece of that puzzle - and it turns out what they actually do is to set a background colour on the empty element and then make it invisible again by setting an opacity filter!

Now, there is no natural link between event transparency and opacity. If a UA implements the former but not the latter, our Google Mappers would have to look for another workaround. It is pure luck that Opera happens to add support for both at the same time, so Google will fix this by using the IE workaround for Opera too.

This issue shows how important it is to standardise a way to say an event should fire on invisible elements. I think addEventListener should be extended with a fourth argument that controls this.

As an aside, to avoid browser sniffing you can use this code to detect support for CSS3 opacity in UAs that support the DOM standard's getComputedStyle:

var el=document.createElement('div');
el.style.opacity='.5';
var opacitySupported=(getComputedStyle( el, 'opacity').opacity)?true:false;

Semantic CSS?

, , , ...

It is generally agreed (and widely ignored) that TABLE in HTML is a semantic element that should be used for organised data.

So, what exactly is an element that is styled with the CSS display:table rule?

Perhaps this is just nitpicking about names, but it seems to me that people want columns and grids for layout, and CSS 2.1 fails at columns but gives them an array of table-* stuff for grids, which really confuses the argument about using tables not for design but for semantics.

Or is the new role of CSS to actually subtly impose HTML4 semantics on random XML documents?