I have this form where you can enter a location, which (if Google can find it) is shown as a marker on a map. Basically I have a Google map with a marker embedded in a form; the map is surrounded with input fields.
When you tab trough the form fields, at a certain point elements within the map are focused. One of the focusable elements is the area in the map used on the marker image. On Chrome 22 and Firefox 15 I can’t see any default focus styling for areas. That annoyed me, so I tried to add some styling. Even without :focus this is not working:
area { outline: 2px solid red; }
Is there a way to style focused Google maps markers?
Edit: Since styling areas does not work I tried to see if I could bind a focus event listener to the areas. There is no focus event available for markers in the Google Api. So, that’s a dead end.
When you try to add a listener on areas (without using the Google Api), you will run into the problem that markers aren’t placed synchronically and that there is no callback available in the Google Api.
You could setup a setInterval to add focus listeners to new areas, but I don’t like that solution a lot.
Does anyone have any other ideas?
For now I would say: no.
There is no CSS support and no support in the Google API to for example change the marker icon on focus (as markers don’t have a focus event).