Hey there! I built a site for client using personify - this is their ‘library’ page: https://hnmedia.fabipaolini.com/video-library/
however-they want to create an effect similar to their old library page when you hover over the items: https://healthnutsmedia.com/hnm-library/
any idea on how i can do this? This is basically the blog post page
Hello @fabipaolini,
You can insert a DIV element and position it as “Absolute” so that it displays on top of the image. This is where you will display the title and your description of the image item. I think removing the Scale effect in the Image element is also needed.
As for the movement of the DIV, how it displays based on where your mouse cursor comes from, this would require a custom JS code. A trigger event when hovering over the item would add a specific class like in-top, in-right, in-bottom, and in-left, which indicates where the mouse cursor comes from before the hover. This class is then used to display the effect.
I think you can simply copy the JS and the custom CSS from the original page and apply this to the current page that you are building on.
Hope this makes sense.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.
