Hotspot with Image and text

Special forum to share and discuss skins for Pano2VR and Object2VR
Post Reply
sparrow
Posts: 49
Joined: Thu Aug 04, 2016 12:44 pm

Mon Mar 23, 2020 7:04 pm

Hi Hopki

Is there a tutoral for achieving the popup as per mockup.

It's basically an image hotspot with accompanying text or vice versa.
Components.jpg
Components.jpg (293.95 KiB) Viewed 107 times
Ideally, the image would sit to the left at certain breakpoints. At smaller breakpoints it would stack above the text.

I know the nuances of how this would behave on different screensizes would need to be considered but looking for a push in right direction.

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

Thu Mar 26, 2020 9:21 pm

Hi sparrow,
See attached.
You use Hotspot Type Image and add the image as you would with the image popup.
It then uses the Hotspots title and description for the title and body text.

I also set that is player width is less than 768px it will scale by 0.8.
Regards,
Hopki
Attachments
image_popup.zip
(41.61 KiB) Downloaded 12 times
sparrow
Posts: 49
Joined: Thu Aug 04, 2016 12:44 pm

Tue Apr 07, 2020 6:22 pm

Thanks Hopki.

Just saw this now and appreciate the demo. It looks simple enough.

In the meantime, I was trying the iFrame tutorial by Tony. In a tour with over 40 hotspots of this kind I am torn between the popup content being native Vs iFrame.

Did you have any possible experience with this?

In my head, these are the Good Vs Bad

iFrame
- GOOD: I can use UIKIT to control the content (I am very comfortable with this)
- GOOD: using CSS, I can rapidly update the look of over 40 html pages with little effort or time
- GOOD: using CSS, I can control the style of the contents within the Description field
- BAD: I don't like using iFrames in general and they can be tricky to control responsively
- BAD: Will an iFrame work when VR mode is enabled?

Native popup
- GOOD: I can work directly within the App
- BAD: My Description field needs some specific styling I probably can't achieve without a rich text editor (bold, italics, bullets)
sparrow
Posts: 49
Joined: Thu Aug 04, 2016 12:44 pm

Tue Apr 07, 2020 6:23 pm

Just found out I *can* use my own HTML in the description field and even my own span classes. Happy days! :D
sparrow wrote:
Tue Apr 07, 2020 6:22 pm
Native popup
- BAD: My Description field needs some specific styling I probably can't achieve without a rich text editor (bold, italics, bullets)
sparrow
Posts: 49
Joined: Thu Aug 04, 2016 12:44 pm

Tue Apr 07, 2020 10:40 pm

Hi @Hopki

I notice the ht_image hotspot has an action to sets the value of the title and description on the popup window.

Why do we do it this way and not just set a placeholder of $(hs) and $(hd) directly in the title and description text field?

I've tried it and can't get it to work so am just curious as to why it wouldn't work.

Thanks
Post Reply