Node Image Shapes?

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

Node Image Shapes?

Post by hromain » Sat Apr 14, 2018 3:55 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: 94
Joined: Mon Oct 19, 2009 11:42 pm

Re: Node Image Shapes?

Post by mbb » Sun Apr 15, 2018 1:28 pm

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

overflow: hidden; border-radius: 50%;

hromain
Posts: 7
Joined: Wed Apr 11, 2018 12:12 pm

Re: Node Image Shapes?

Post by hromain » Sun Apr 15, 2018 5:36 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 78 times

mbb
Posts: 94
Joined: Mon Oct 19, 2009 11:42 pm

Re: Node Image Shapes?

Post by mbb » Sun Apr 15, 2018 6:33 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: 7
Joined: Wed Apr 11, 2018 12:12 pm

Re: Node Image Shapes?

Post by hromain » Sun Apr 15, 2018 8:34 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 72 times

User avatar
Hopki
Gnome
Posts: 8060
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Re: Node Image Shapes?

Post by Hopki » Sun Apr 15, 2018 9:00 pm

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 6 times

hromain
Posts: 7
Joined: Wed Apr 11, 2018 12:12 pm

Re: Node Image Shapes?

Post by hromain » Sun Apr 15, 2018 9:34 pm

Perfect. Thank you!

User avatar
Tony
Posts: 366
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Re: Node Image Shapes?

Post by Tony » Mon Apr 16, 2018 1:49 am

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: http://tonyredhead.com - http://redsquare.com | google+: http://google.com/+tonyredhead

Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest