Invisible content extending outside scroller in HTML5 target

[jonmoat]

This is related to a previous post about visible content appearing outside the scroller in HTML5.

Box content outside the scroller is not visible but it is masking other content (dependent on layer) and taking mouse events (overflow = false).

I have added a mouseClick listener to the Scroll widget in the samples (using the map). If I click outside the scroller over a point where the map virtually is when scrolled, it is taken.

With the vertical NME scroller in the same example, scrolling can be achieved by dragging above or below (outside) the scroller.

Any thoughts on how to fix this? It is currently breaking our app.

openfl: [2.0.1], Haxe: [3.1.3], stablexui: [1.0.17]

[RealyUniqueName]

You can try following workaround: On mouse event check if event coordinates are out of Scroll boundaries. If so, get next object under Scroll with .getObjectsUnderPoint() and fire event on that object.

[jonmoat]

Thanks for the suggestion - we'll try that. Could you please give some example code of how to fire a mouse event on the object?

[jonmoat]

Just to clarify, is this an issue with Stablexui or is it the HTML5 backend in Openfl? (I'd like to know whether I should pursue it further on the Openfl forum.)

[RealyUniqueName]

it's an issue of OpenFL's html5 backend.

Code should look like this:

scroll.addEventListener(MouseEvent.CLICK, function(e:MouseEvent) {
    if (e.localX < || e.localX > scroll.w || e.localY < 0 || e.localY > scroll.h) {
        e.stopImmediatePropagation();
        var objList = Lib.current.stage.getObjectsUnderPoint(new Point(e.stageX, e.stageY);
        var nextObj = ... //iterate through objList to find next object below scroll
        nextObj.dispatchEvent(new MouseEvent(MouseEvent.CLICK, ....));
    }
});

[jonmoat]

OK - thank you for the code. Much appreciated.