Hover and click on buttons in round cakeform (Missing polygon button)

Special forum to share and discuss skins for Pano2VR and Object2VR
Post Reply
snmabaur
Posts: 8
Joined: Mon Oct 04, 2021 3:03 pm

Hi

I'm trying to build a pan controller with the 4 buttons aligned as a cakeform like in the screenshot below

Screenshot 2021-10-06 at 17.10.29.png
Screenshot 2021-10-06 at 17.10.29.png (18.93 KiB) Viewed 1605 times

Inside the screenshot there are the 4 pan buttons and the red line is the controller marking the pan left button... the actual grey or yellow part is an svg... the tree structure of my buttons is shown in the image below

Screenshot 2021-10-06 at 17.15.47.png
Screenshot 2021-10-06 at 17.15.47.png (93.84 KiB) Viewed 1605 times

The problem is now that the hover or the click on the element overlaps the other buttons, so this solution would not work

Is there someone who had a similar problem to solve this design problem?

Thank you very much
User avatar
Hopki
Gnome
Posts: 13004
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi,
Working project attached.

nav.png
nav.png (898.15 KiB) Viewed 1562 times

See if you can work it out, but as a hint, it uses CSS Radius for the masking container, which is then rotated.
Then it's just a case of adjusting the angles and position of rectangles.
Regards,
Attachments
nav.zip
(13.96 KiB) Downloaded 129 times
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
snmabaur
Posts: 8
Joined: Mon Oct 04, 2021 3:03 pm

Perfect thank you very much, works like a charm

PanControlRound.mp4
(1.66 MiB) Downloaded 126 times
User avatar
Hopki
Gnome
Posts: 13004
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Nice 8)
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
Post Reply