Close container with click on pinned image / image hotspot

[Sanny]

Hi everyone,

I´m new here and really hope, that someone can point me to the solutions of my problems.

What I want to acchive:
I want to have a pinned image in my tour. The user clicks on the image, the image opens with that nice animation and at the same time a container with 2 buttons in it will open ABOVE the pinned image.

By clicking on
a) the enlarged pinned image OR
b) outside the enlarged pinned image OR
c) the Container with the buttons
EVERYTHING (enlarged pinned image, Container with Buttons) shall close. By clicking on one of the buttons, a link will be opend.

pinned-image-explanation.jpg (143.86 KiB) Viewed 2142 times

Lots of Questions:
1. Is it possible to open the pinned image at 90%, not at 100%?
2. Is it possible to give that pinned image a css class? (Maybe I could trigger the size and z-index via Media Queries/css)
3. Is it possible to adress the pinned image in the skineditor (f.e. by ID like polyhotspots?)
4. Is it possible to close a container by clicking on pinned image?
5. Is it possible to show the container with the buttons ABOVE the pinned image?

What I did so far:
- Created a pinned image, named it „pic-menu“ and a polygon hotspot above it, named it „poly01“ (Listview: pic above poly)

In the skin editor I created:
- 1 container called „main“ (100% width & height). Inside „main“ there are
a) two textboxes, called„Button 1“ and „Button 2“ and below
b) two rectangles. One of these rectangles is the background for the buttons, called „bg-buttons“, the other one in 100% width & height to close everything - called „menu-screentint“.

tree.JPG (27.46 KiB) Viewed 2142 times

- a rectangle, gave it Hotspotproxy ID „poly01“
- a variable, which hides the Container „main“ at the beginning and shows it by clicking on polyhotspot. Works fine.
- Click on „menu-screentint“ and „bg-buttons“ set the variable to hide „main“ and content. Works fine, too.
- BUT: if I click on the enlarged pinned image, the image closes, but NOT the „main“-container. So I need to find a possiblity to close „main“ by clicking on the opened pinned image.

I hope, it was understandable… does anyone have an idea?

Thank you!

[hromain]

Hi!

I'm very interested in the answer to this as well. Were you able to find a solution?

[Sanny]

Hi Hromain,

no, unfortunately not... I ended up with an external image, which is not exactly what the client and I wanted, but well... at least it works.
I dont know, why nobody answered my questions - maybe my post was too long?

Try to cut long things short:

1. Is it possible to open the pinned image at 90%, not at 100%?
2. Is it possible to give that pinned image a css class? (Maybe I could trigger the size and z-index via Media Queries/css)
3. Is it possible to adress the pinned image in the skineditor (like polyhotspots?)
4. Is it possible to close a container by clicking on pinned image?
5. Is it possible to show the container with the buttons ABOVE the pinned image?

I am working with the pro license, if that is important somehow?

Help is still appreciated...

[Hopki]

Hi Sanny,
1. Is it possible to open the pinned image at 90%, not at 100%?
No, you can poppet full size or 100%.

2. Is it possible to give that pinned image a css class? (Maybe I could trigger the size and z-index via Media Queries/css)
Nope, but will speak with the developers to see if you should, and if so I can raise a feature request.

3. Is it possible to address the pinned image in the skin editor (like polyhotspots?)
Yes,
Source: Mouse Click
Action: Media
Type: Activate Media
Mode: Activate
Target: media ID

4.Is it possible to close a container by clicking on pinned image?
5.Is it possible to show the container with the buttons ABOVE the pinned image?

For these two you can do little tricks as long as you don't pop out the pinned image, you can use a Hotspot with 3D distortion.
The way you have done it using a pop up image is probably the better way to be honest.
Browser updates are know to brake pinned elements where a pop up image is far more robust.
Regards,
Hopki

[Sanny]

Hey Hopki,

1./2. - Okay, maybe in the future...

3. Yes, I found that possiblity. That means, the only thing I can do with the pinned media from the skin editor is activate or deactivate it, correct?

Alright, so the client has to live with this solution for the moment. I hoped, there might be a way I had not tried / found yet - but what you said with browser support is definitely important.

Thank you for your feedback!

Best regards,
Sanny