ActivePresenter Saola Animate Pricing Download

Increasing clickable area of an element, easy way?

Hello, I have some relatively small elements (triangles) on the canvas allowing the user to skip to the next scene. Now I wonder how one could increase the clickable area by e.g. having a invisible border?

How would I do this?

I attached a class “smallTouchable” to the element (an svg shape) and then tried with CSS like that:

.smallTouchable{
position:relative;
}

.smallTouchable:after{
content:’’;
position:absolute;
padding: 100px;
top:-50px; bottom:-50px;
left:-50px; right:-50px;
}

Although the css is applied to the div in the DOM, it won’t increase the clickable size.

Thanks!

v3 adds support for pass through transparent areas.

You can bypass it without CSS. Add the line to the triangle with a decent width. Set colour to white and adjust the alpha level to zero.

image

2 Likes