SVG Help - Inline or Visibility detection

[Andrew01]

Hey all,

First off, excuse me if this is the incorrect forum, I'm new here and I'll learn with time. (=

I've spent about a week looking for a solution to a problem I'm not even sure is addressable. I'll describe it:

I'm working on an application for a mobile device that uses SVG and I'm stuck on a particular problem.

When a user rolls over ("focusin") on a particular element the device automatically displays their upcoming calendar events above. However, the upcoming calendar events are using white text and can be difficult to see, so I'd like to add a background image behind the text to make it easier.

Right now I have it set up so that when the calendar information is present, if the user scrolls up to select one of the calendar list items (hotspot1) the background image (#calendarbackground) appears using this code:

<set xlink:href="#calendarbackground" attributeName="display" to="inline" begin="today_text1hotspot.focusin"/>

This of course means that when the text first appears, it has no background until the user scrolls up and focuses in on the first text element. I would prefer the #calendarbackground image to appear when the text hotspot1 is "inline", that is, visible to the user.

Something like this:

<set xlink:href="#calendarbackground" attributeName="display" to="inline" begin="today_text1hotspot.display:inline"/>

Of course, the "begin="today_text1hotspot.display:inline" code doesn't actually work, but I'm wondering if there is a way to "begin" something without using focusin, focusout, or activate, which as I understand are the only three real options.

I'm at my wits end with this one, and I just can't commit any more time to it unless I know such a thing is even possible.

Thanks for any input you can provide.

Cheers!

 

[tsuji]

>I'm at my wits end with this one, and I just can't commit any more time to it unless I know such a thing is even possible.
Since under the pressure of time is never a good sign to add advice of any kind without knowing what have been done and what can be done: it only adds confusion and frustration.

Now that the time passes, I can only suggest that it can be done making use of MutationEvent support of svg, in particular, the DOMAttrModified event. Add the event listner of DOMAttrModified to the today_text1hotspot (through getElementById() with id of some kind). When the appropriate attribute like "to" is changed to "inline", trigger the "set" element of the element with xlink to having some kind of background image etc...

To the same kind of reasoning, even if we don't appeal to mutation event, you can most probably do the same with the focusin/focusout event handler to do the same of setting and retiring the desired background image for the "set" element containing the xlink.

However, svg event model's support out-there can be very uncertain and incomplete. Maybe your mobile application platform do better (since there is near-to-ready fiscal reward as incentive to make the implementation.)