HTML Elements Forums Window & Popups Tooltip Dynamic change content of Tooltip

This topic contains 2 replies, has 2 voices, and was last updated by Avatar Anonymous 2 years, 6 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #98842
    Avatar
    Anonymous

    Hello,

    I am new here. And I’m interesting about this framework. How can I set dynamic Tooltip?
    I wont to change the content of the Tooltip? Let’s say when I click on the button.

    Thanks,
    –Aleksandar Laskin

    #98843
    Avatar
    Anonymous

    Hi pcng618,

    In order to change the content of the Tooltip dynamically you need to set the innerHTML property of the Tooltip instance. To change it when clicking on a button you have to bind to it’s click event and simply set the new content to the innerHTML property of the Tooltip. Here’s an example:

    
    <head>
     <script>
            window.onload = function () {
                var tooltip = document.querySelector('smart-tooltip');
    
                document.getElementById('myButton').addEventListener('click', function (event) {
                    document.getElementById('tooltip').innerHTML = 'The button is clicked !';
                })
            }
        </script>
    </head>
    <body>
        <smart-button id="myButton"></smart-button>
        <smart-tooltip id="tooltip" selector="myButton">Some Random Text</smart-tooltip>
    </body>
    

    Best Regards,
    Christopher

    SmartElements Team
    http://www.htmlelements.com

    • This reply was modified 2 years, 6 months ago by Avatar .
    • This reply was modified 2 years, 6 months ago by Avatar .
    #98852
    Avatar
    Anonymous

    Hi Christopher,

    Thank you for this example. I will use this native way.

    –Aleksandar Laskin

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.