Tagged: , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • November 17, 2015 at 11:57 am #537229
    temptel

    Hello,

    I have a slider done with layerslider, and i want to add a feature to it, a icon where when the user has the mouse over it the slider shows a message, somethin “simple” but i don´t know if it is possible.

    Here you have something “similar” to what i want to do:

    https://www.keadventure.com/destinations/europe/italy

    You can see a camera icon in the slider, and when you set the mouse over it you see a message.

    how can i do something similar?

    Thanks

    November 17, 2015 at 5:37 pm #537477
    Elliott

    Hey temptel!

    Our icon element can do something similar, http://kriesi.at/themes/enfold-startup/. It will display a tooltip instead.

    Regards,
    Elliott

    November 17, 2015 at 6:01 pm #537528
    temptel

    Hi Elliott,

    That effect is ok, but i would need to add it or do something similar into a slider done with the advanced layerslider, is it possible?

    Regards.

    November 19, 2015 at 6:03 am #538731
    Ismael

    Hi!

    You can add an icon shortcode with a tooltip as one of the layer. Note that the shortcode is not going to work when you preview it but it should work in the frontend.

    Best regards,
    Ismael

    April 8, 2019 at 6:54 pm #1088410
    JantienM

    Hi Ismael,

    I have the same issue. In layerslider I want a layer to appear only when the user hovers. The layer I want to appear is a tooltip. Beneath this layer is another layer with an image. This image has a hover transition (it rotates when the user points at it).

    I tried several ways to make work what I want:
    1 Added a text layer and tried to make it work through the hover transition; problem here is that it is already visible, I can’t make it work that it is invisible unless the user points at it.
    2 Added an icon with tooltip as shortcode; problem with this option: the tooltip won’t show when I place it at the same spot as the image
    3 Tried to find a way of adding custom css to the image under the styles tab of the layer with the image, but thought maybe that’s too complicated and decided to ask you guys first

    Thanks!

    Update: After some research I found out that the two layers have to be placed in one div otherwise two hovers cannot be active at the same time. Is there a way to put two layers in one div using custom css? On this site it says you have to use javascript, but there is also mentioned to wrap both in one div: https://stackoverflow.com/questions/28148040/how-to-hover-mutiple-div-in-the-same-time.

    • This reply was modified 5 years, 6 months ago by JantienM.
    April 11, 2019 at 11:34 pm #1089766
    Ismael

    Hi,

    There is no option in the layer slider that can do that by default. You have to create a custom script like the one suggested in the stackoverflow thread. Or try this one.

    // https://www.w3schools.com/css/css_tooltip.asp

    Best regards,
    Ismael

    April 12, 2019 at 2:02 pm #1090064
    JantienM

    Hi Ismael,

    Thanks for your reply. Just wanted to add that I found another solution. I let go of the LayerSlider and I installed the plugin Image Hover Effects Ultimate – Captions Hover with Visual Composer and was able to accomplish what I had in mind.

    Thanks!

    April 13, 2019 at 2:41 am #1090219
    Jordan Shannon

    Hey JantienM,

    I’m glad you found a solution. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.