Hi all,
My clickmap has several screw heads, each being a group consisting of a circle, a path in the shape of a cross for a phillips screwdriver to go into, and an elipse that acts as a highlight. Each screw head group has an onclick event, and it fires just fine. But...
In the Javascript function that receives the onclick event, evt.target is not the group, it's the individual geometry within the group that got clicked. So depending on the exact position of the mouse when clicking, it could be the circular head, the path of the cross, or the elipse highlight. Why an onclick for the group returns a target that's one of the group's items is beyond me. Here's how I dealt with it in the HTML page:
function screwclick(e){ var parnt = e.target.parentElement; var circle = parnt.getElementsByTagName("circle")[0]; circle.style.fill = "gold"; }
I found the parent of evt.target, then found the circle that was part of that parent, and then colored the circle. Before I figured out how to do that, sometimes the cross was turning gold, and sometimes the highlight was turning gold. Now only the circle turns gold.
This could really fool a person who isn't looking for it.
SteveT
Steve Litt April 2017 featured book: Troubleshooting Techniques of the Successful Technologist http://www.troubleshooters.com/techniques
I can no longer recommend my suggestions, of May 1, concerning how to put an onclick on a group. It's doable, but messy.
What I'm now recommending is to include in the group a transparent cover, in the shape of the entire group object, and that the transparent cover be the only entity in the group to contain an onclick, onmouseover, onmouseout, etc. MUCH more predictable and easy.
The only exception to the preceding recommendation is if you actually want clicks on different parts of an object to do different things. A rocker switch is a good example. But even then, the way I'd do it is to have two transparent cover objects: one covering one pressible point on the switch, and the other over the other pressable point.
I can no longer see any situation where putting events on the group as a whole would be valuable.
Thanks,
SteveT
Steve Litt May 2017 featured book: Twenty Eight Tales of Troubleshooting http://www.troubleshooters.com/28
On Mon, 1 May 2017 01:41:55 -0400 Steve Litt <slitt@...2357...> wrote:
Hi all,
My clickmap has several screw heads, each being a group consisting of a circle, a path in the shape of a cross for a phillips screwdriver to go into, and an elipse that acts as a highlight. Each screw head group has an onclick event, and it fires just fine. But...
In the Javascript function that receives the onclick event, evt.target is not the group, it's the individual geometry within the group that got clicked. So depending on the exact position of the mouse when clicking, it could be the circular head, the path of the cross, or the elipse highlight. Why an onclick for the group returns a target that's one of the group's items is beyond me. Here's how I dealt with it in the HTML page:
function screwclick(e){ var parnt = e.target.parentElement; var circle = parnt.getElementsByTagName("circle")[0]; circle.style.fill = "gold"; }
I found the parent of evt.target, then found the circle that was part of that parent, and then colored the circle. Before I figured out how to do that, sometimes the cross was turning gold, and sometimes the highlight was turning gold. Now only the circle turns gold.
This could really fool a person who isn't looking for it.
SteveT
Steve Litt April 2017 featured book: Troubleshooting Techniques of the Successful Technologist http://www.troubleshooters.com/techniques
Check out the vibrant tech community on one of the world's most engaging tech sites, Slashdot.org! http://sdm.link/slashdot _______________________________________________ Inkscape-user mailing list Inkscape-user@lists.sourceforge.net https://lists.sourceforge.net/lists/listinfo/inkscape-user
participants (1)
-
Steve Litt