-
1. Re: how to "click through" ?
Hey Gil
Are you saying that this symbol has no 'click' handler to begin with, but it's presense (in front of everything else) is preventing you from clicking items behind it?
If so, sounds like it may just be a z-index order issue of the snowShower. Does it have to 'out front'? Can it be positioned lower in the stack.
Darrell
-
2. Re: how to "click through" ?
Hi Darrell,
Sadly, assigning the z-index would make the snow animation covering the whole stage run behind the symbols tiling it :-(
As a (poor) workaround, I have set a click event handler on snowShower to make it disappear.
But this is not very user-friendly, forcing a first click to get rid of the snow and a second one to choose a section. Ideally, I would like that clicking a button through the shower make it disappear and trigger the button's handler.
It has to do with passing the click event in the DOM after snowShower has captured it at first. In other words, I would like snowShower to still capture the click event, but without consuming it.
Gil
-
3. Re: how to "click through" ?
Ya I see what you mean, now. Yes that is tricky and will have to test.
Couple of thoughts on quick search
- just discovered this option through search: css pointer-events, example here (http://fromanegg.com/post/32669641429/clicking-through-a-div-to-underlying-elements)
- some ideas through event ordering/bubbling http://www.quirksmode.org/js/events_order.html (sounds more like the process you areafter)
Alternatively, does the snow effect have to be in its own Symbol? Example here is a sample I did awhile, based off code-player website example.
The snow effect is is front of everything but is drawn by a canvas object; the text element 'below' it is clickable to the link I have designated to it.
Preview: http://heathrowe.com/edge/snowflakes/
Download: http://heathrowe.com/edge/snowflakes/snowflakes.zip (Code is in Stage > creationComplete event handler)
hth
Darrell
-
4. Re: how to "click through" ?
Not sure about how your snow is implemented but, is there a way you could add a transparent button that would be on a layer above the snow and at the same place as the button you want to click?
-
5. Re: how to "click through" ?
Hi Marie, hi Darrell,
toDo_stack.pop() : back to this problem ! Thank you for your leads.
I have investigated bubbling. It would indeed be the solution when the different elements are nested. For example, a series of buttons in a container div. A click on a button could trigger a handler specific to that button, then (bubbling up at the container level) a second handler common to every button.
But my snowShower is a child of the Stage and the buttons that show underneath are its siblings.
I finally found the solution today reading a book about D3 :
sym.getSymbol("snowShower").getSymbolElement().css({"pointer-events" : "none"});
This makes snowShower "transparent" to mouse events and the buttons react through the covering animation.
Gil
-
-
7. Re: how to "click through" ?
Awesome - I mention that in my first link reference (fromanegg) and it was the first I have heard of it. Though it is not js related, its drawback is it only works on (css3) modern browsers - but then again, everyone should be using modern browsers (chuckle chuckle).
Darrell
-
8. Re: how to "click through" ?
Haha, Darrell!
Some people are still on dialup (even in the US), so I guess this world is not all up to speed yet!
-
9. Re: how to "click through" ?
Sorry, Darrell. I skipped that and jumped directly to bubbling :-)
Gil