Hi folks,
I have a few hotspots close to each other, and they overlap when selected or in overlay. I found that z-index is controlled by CSS but I'm not sure which layer should contain the style. I tried different options, with the CSS in each of the layers or adding an Action with the z-index with not much success. I have attached some screen captures.
Does anyone know how this works?
Thanks!
hotspot z-index when selected
- Hopki
- Gnome
- Posts: 13032
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi,
In this example we are going to change the z-index of the ht_info point Hotspot Template.
All the popup elements are a child of the Hotspot Template, ht_info.
Set the z-index of the template to -1.
The button that opens the info text box will also have the action:
Source: Mouse Click
Action: Go To URL
URL: javascript:me._ht_info.style.zIndex='0';
Target, leave blank
This brings the z-index for this one hotspot from -1 to 0, so its above all others.
The close button needs a similar action but this time the z-index ='-1'.
Regards,
In this example we are going to change the z-index of the ht_info point Hotspot Template.
All the popup elements are a child of the Hotspot Template, ht_info.
Set the z-index of the template to -1.
The button that opens the info text box will also have the action:
Source: Mouse Click
Action: Go To URL
URL: javascript:me._ht_info.style.zIndex='0';
Target, leave blank
This brings the z-index for this one hotspot from -1 to 0, so its above all others.
The close button needs a similar action but this time the z-index ='-1'.
Regards,
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/
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/
Thank you Hopki,
It works at the beginning but after clicking in different hotspots it overlaps again. Attached are some screen captures and a screen video.
I'm sure I've missed some step![Razz :P](./images/smilies/icon_razz.gif)
It works at the beginning but after clicking in different hotspots it overlaps again. Attached are some screen captures and a screen video.
I'm sure I've missed some step
![Razz :P](./images/smilies/icon_razz.gif)
- Attachments
-
- 05.jpg (624.87 KiB) Viewed 441 times
-
- 04.jpg (649.24 KiB) Viewed 441 times
-
- 03.jpg (681.43 KiB) Viewed 441 times
-
- 02.jpg (671.49 KiB) Viewed 441 times
-
- 01.jpg (608.76 KiB) Viewed 441 times
Here is the video
- Attachments
-
- hotspots.mp4
- (4.97 MiB) Downloaded 17 times
- Hopki
- Gnome
- Posts: 13032
- Joined: Thu Jan 10, 2008 3:16 pm
- Location: Layer de la Haye, Essex UK
- Contact:
Hi,
The way to solve this is to use a trigger click action.
Open the attached project, the element info_dot has the actions to open the info popup.
The element ht_info_close has the actions to close it, as well as the info_text, so this can also be clicked to close the popup.
You will see in the element info_dot that there is a Mouse Click, Trigger Click action targeting the ht_info_close.
This is at the top of the action list, actions get triggered starting from the top and work down.
For this action to target all instances, so all point hotspots it proceeds the action with a pond sign, #.
So when clicking the info_dot element it first closes all info point hotspots, sending them all to z-index -1.
Then sets the variable and then sets the z-index for that one to 0.
Regards,
The way to solve this is to use a trigger click action.
Open the attached project, the element info_dot has the actions to open the info popup.
The element ht_info_close has the actions to close it, as well as the info_text, so this can also be clicked to close the popup.
You will see in the element info_dot that there is a Mouse Click, Trigger Click action targeting the ht_info_close.
This is at the top of the action list, actions get triggered starting from the top and work down.
For this action to target all instances, so all point hotspots it proceeds the action with a pond sign, #.
So when clicking the info_dot element it first closes all info point hotspots, sending them all to z-index -1.
Then sets the variable and then sets the z-index for that one to 0.
Regards,
- Attachments
-
- project.zip
- (1.33 MiB) Downloaded 19 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/
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/