Node Image Shapes?

Special forum to share and discuss skins for Pano2VR and Object2VR
Post Reply
hromain
Posts: 42
Joined: Wed Apr 11, 2018 12:12 pm

Hi,

Is it possible to edit the shape of node images? I'd like to make mine circular but don't see an option for adjusting the radius like there is with rectangles. I tried adding a "border-radius" property in the CSS, but it only makes a circle behind the node image and doesn't affect the shape of the image itself.
mbb
Posts: 276
Joined: Mon Oct 19, 2009 11:42 pm

put the following into the "CSS Styles:" field in the Node Image Advanced Properties:

overflow: hidden; border-radius: 50%;
hromain
Posts: 42
Joined: Wed Apr 11, 2018 12:12 pm

That's just what I was looking for, but here's one quick follow up: now, the tooltip is overflowing the rounded border of the node image. Is there a way to make it match the border of the node image without covering the image completely? I want to keep it looking like this image:
Attachments
hotspot.png
hotspot.png (9.33 KiB) Viewed 4819 times
mbb
Posts: 276
Joined: Mon Oct 19, 2009 11:42 pm

Sorry, I have no idea what you are talking about now.

Do not know what you mean by "tooltip is overflowing the rounded border of the node image"
hromain
Posts: 42
Joined: Wed Apr 11, 2018 12:12 pm

Apologies for the confusion. I've attached a screenshot to illustrate. Ideally, I'd like the tooltip background to end at the circular border of the node image instead of how it sits now.
Attachments
Screen Shot 2018-04-15 at 1.00.22 PM.png
Screen Shot 2018-04-15 at 1.00.22 PM.png (269.5 KiB) Viewed 4813 times
User avatar
Hopki
Gnome
Posts: 13005
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi,
In V5 or 6 use a masking container with the following CSS.

CSS for the container that is set to making::

Code: Select all

overflow: hidden; border-radius: 50%; border-style: solid; border-width: 2px
Working project attached.

Regards,
Hopki
Attachments
CircleTooltip.zip
(29.33 KiB) Downloaded 194 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/
hromain
Posts: 42
Joined: Wed Apr 11, 2018 12:12 pm

Perfect. Thank you!
User avatar
Tony
Posts: 1341
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Hi Hopki,

Thanks for the skin. Nice addition to my collection of Hopki inspired skins :D

cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: https://tonyredhead.com - https://redsquare.com | Pano2VR Tutorials: https://tonyredhead.com/pano2vr | instagram: https://www.instagram.com/tonyredhead/
User avatar
Hopki
Gnome
Posts: 13005
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

And just because I can :D
Here its using a timer and animated rectangles as well as fade in the preview and tooltip text.
Regards,
Hopki
Attachments
CircleTooltip.zip
(31.98 KiB) Downloaded 208 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/
Post Reply