calebjacob / tooltipster

A jQuery tooltip plugin
MIT License
2.76k stars 482 forks source link

Interactive Tooltip with delay 0 not working #818

Open pacocom opened 3 years ago

pacocom commented 3 years ago

I can work with interactive with delay (leave delay) equal 0.

Please visit the tooltip competitor https://codesandbox.io/s/material-demo-forked-smssv?file=/demo.js For me is mandatory to use tooltipster

I don't want this behaviour either, please show next image: image

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Tooltipster interactive not working with delay 0</title>

    <link
      rel="stylesheet"
      type="text/css"
      href="https://cdnjs.cloudflare.com/ajax/libs/tooltipster/4.0.3/css/tooltipster.bundle.css"
    />
    <script
      type="text/javascript"
      src="https://code.jquery.com/jquery-1.12.4.min.js"
    ></script>
    <script
      type="text/javascript"
      src="https://cdnjs.cloudflare.com/ajax/libs/tooltipster/4.0.3/js/tooltipster.bundle.min.js"
    ></script>
  </head>
  <body>
    <span
      class="demo-interact"
      title="Try clicking &lt;a href='http://google.com/' target='_blank'&gt;this link&lt;/a&gt;"
    >
      Hover
    </span>

    <span
      class="demo-interact"
      title="Try clicking &lt;a href='http://google.com/' target='_blank'&gt;this link&lt;/a&gt;"
    >
      Hover
    </span>

    <span
      class="demo-interact"
      title="Try clicking &lt;a href='http://google.com/' target='_blank'&gt;this link&lt;/a&gt;"
    >
      Hover
    </span>

    <span
      class="demo-interact"
      title="Try clicking &lt;a href='http://google.com/' target='_blank'&gt;this link&lt;/a&gt;"
    >
      Hover
    </span>

    <span
      class="demo-interact-50"
      title="Try clicking &lt;a href='http://google.com/' target='_blank'&gt;this link&lt;/a&gt;"
    >
      Hover
    </span>
  </body>
  <script>
    // Interactive not working

    $(".demo-interact").tooltipster({
      contentAsHTML: true,
      interactive: true,
      delay: [0, 0],
    });

    // Interactive working but I don't want overlay behaviour
    $(".demo-interact-50").tooltipster({
      contentAsHTML: true,
      interactive: true,
      delay: [0, 50],
    });
  </script>
</html>
karima-hussein commented 2 years ago

hi @pacocom , I have the exact same issue, the tooltip isn't reactive when delay is 0 Did you manage to solve it ?

pacocom commented 2 years ago

My solution was increase delay to 50 but with overlay behaviour.