I've looked at some of the previous posts about the built-in hover state being a little buggy, So here's a great example of it. I've used this functionality before with other Storyline projects, but I just don't know why with this one the objects start disappearing. I've checked with multiple browsers and I'm getting the same results or varied results.
I took a look and I noticed there's some very odd behavior going on with the images. I do see what you're describing regarding the hover as well.
I removed all of the hotspots and triggers in the original course and just added a hover state to each image.
I'm attaching the file for you, just in case you'd prefer to use this method - in my opinion it's cleaner and the hover functions much better.
I went back to the initial file for a little testing to see what may be causing the problem. It looks like the issue is with the custom "Highlight" state and the collection of hotspots.
Can you take a look at the attached file and let me know if this method will work for you and if it's working properly, please?
Thank you very much Christine for taking a look at it
I had the file initially set up that way, but since I have overlapping images, I had to add the hotspots.
For example, the image of the teacher and student circle overlaps the bookshelf (which also needs to be included as a hover).
So far what I know in Storyline, it still counts the transparent parts of the png image as live areas. So if I try to hover on the bookshelf, I get the student circle description instead of the bookshelf.
Any way around that or another idea that doesn't involve changing the design of the interaction?
I had that problem too and ended up moving the image with the teacher and children. As I mentioned earlier, the images weren't quite behaving properly for me - I wasn't able to crop or make any sizing changes to them. One thought would be to cut out that additional "empty" area of that image - even if you add a hotspot, that corner might cause some frustration if it's over other content you need to interact with.
For the majority of the images on your slide, the normal "Hover" state does seem to work well. The main two that need some adjustments are the one we mentioned (with the teacher) and the bookshelf that's behind her and the students.
Now, if I add a hotspot similar to the ones you were using for the toy shelf, all works well. That is, until I hover over the image with the teacher. I think I was able to fix this, actually - looks like if you add an additional trigger to change the state of the shelf to "Normal" when the mouse is hovered over the teacher and disable the mouse restore option, it doesn't disappear.
So, it really does look like it's an issue related to that particular image, or the extra transparent space.
Can you take a look at the new changes and let me know how that goes for you?
3 Replies
Hi Virgil,
Thanks for sharing the file!
I took a look and I noticed there's some very odd behavior going on with the images. I do see what you're describing regarding the hover as well.
I removed all of the hotspots and triggers in the original course and just added a hover state to each image.
I'm attaching the file for you, just in case you'd prefer to use this method - in my opinion it's cleaner and the hover functions much better.
I went back to the initial file for a little testing to see what may be causing the problem. It looks like the issue is with the custom "Highlight" state and the collection of hotspots.
Can you take a look at the attached file and let me know if this method will work for you and if it's working properly, please?
Thanks!
Thank you very much Christine for taking a look at it
I had the file initially set up that way, but since I have overlapping images, I had to add the hotspots.
For example, the image of the teacher and student circle overlaps the bookshelf (which also needs to be included as a hover).
So far what I know in Storyline, it still counts the transparent parts of the png image as live areas. So if I try to hover on the bookshelf, I get the student circle description instead of the bookshelf.
Any way around that or another idea that doesn't involve changing the design of the interaction?
Hi Virgil,
I had that problem too and ended up moving the image with the teacher and children. As I mentioned earlier, the images weren't quite behaving properly for me - I wasn't able to crop or make any sizing changes to them. One thought would be to cut out that additional "empty" area of that image - even if you add a hotspot, that corner might cause some frustration if it's over other content you need to interact with.
For the majority of the images on your slide, the normal "Hover" state does seem to work well. The main two that need some adjustments are the one we mentioned (with the teacher) and the bookshelf that's behind her and the students.
Now, if I add a hotspot similar to the ones you were using for the toy shelf, all works well. That is, until I hover over the image with the teacher. I think I was able to fix this, actually - looks like if you add an additional trigger to change the state of the shelf to "Normal" when the mouse is hovered over the teacher and disable the mouse restore option, it doesn't disappear.
So, it really does look like it's an issue related to that particular image, or the extra transparent space.
Can you take a look at the new changes and let me know how that goes for you?
Thanks!
This discussion is closed. You can start a new discussion or contact Articulate Support.