Okay
  Public Ticket #3182682
Animated tooltips
Closed

Comments

  • Chris Bradbury started the conversation

    I have some colour coded definitions, but there is not space on the slide to include them. I would like to display a tooltip style definition on hovering over a coloured circle.

  •  111
    George replied

    Hello Chris,

    Could you, please give me more details about this? Can I see your website, or can you show me screenshots?

    Best Regards,
    George | Kreatura Dev Team

  • Chris Bradbury replied

    Hi George,

    Here is a screenshot. The IMPORTANT NOTICE and the list below, are outside of the slider.

    I would like to be able to show a tooltip of information when hovering over any of the products on the slide, or their associated colour circles. I would like to show the corresponding information from below IMPORTANT NOTICE.

    For instance, hovering over NUTRINI LOW ENERGY MULTI FIBRE, or the pink circle below it, will display the information associated with the pink circle in the list below IMPORTANT NOTICE.

    7259822924.png


  • Chris Bradbury replied

    Hi George - any update?

  •  111
    George replied

    Hello Chris,

    So if I understand well, you would like to show various HTML elements outside of the slider if you are hovering with your mouse on different layers?

    Best Regards,
    George | Kreatura Dev Team

  • Chris Bradbury replied

    Hi - no, the content outside the slider is just an example of the kind of content that will feature in the tooltip.

    I would like to show a hidden <div> as a tooltip/info-bubble when hovering over an item.

  • Chris Bradbury replied

    Hi George - this isn't what I was expecting when I paid for extended support!

  •  111
    George replied

    Hello Chris,

    What you would like to achieve, that requires JavaScript programming knowledge. We are happy to help you using the slider, but we cannot provide guidance on individual programming. The jQuery version of LayerSlider does not have a function that allows you to change elements outside or inside the slider with a click or with hovering on an element. If you are experienced in programming, you can use custom code, e.g.: 

    jQuery( 'yourlayer' ).on( 'click', function(){ here comes your code ... });

    but we cannot help you write the specific code.

    Best Regards,
    George | Kreatura Dev Team

  • Chris Bradbury replied

    I am a reasonably experienced web developer, but I thought I would check if there was some functionality like this built into the slider already.

    Not sure why it took you over 48hrs to tell me you can't help me...

  • Chris Bradbury replied

    It's really not something that can only be solved with JS!

    Here is a CSS only solution for instance - adding some transitions would make it look even better!
    https://codepen.io/FlorinPop17/pen/YbrNxZ

  •  111
    George replied

    Yes, solutions like this are very nice and clean. With JS, it would be more complicated. We are planning to add an extended layer actions functionality to a future version of the plugin.

    Best Regards,
    George | Kreatura Dev Team