DayPilot.Bubble.showHtml

The showHtml() method displays the bubble with the specified HTML.

Declaration

DayPilot.Bubble.showHtml(html[, element]);

Parameters

• html (string) - HTML to be displayed in the bubble

• element (HTMLElement) - reference DOM element

The element argument is specifies the reference DOM element:

• it is used as the position reference point when position is set to "Above"

• the bubble won't be hidden automatically as long as you keep the mouse on the reference element (see also hideAfter)

Example

<button id="bubble">Show bubble</button>

<script>
  const bubble = new DayPilot.Bubble({
      onLoad: (args) => {
          args.html = "This is a bubble";
      }
  });

  const button = document.querySelector("#bubble");

  button.addEventListener("mouseenter", (ev) => {
      bubble.showHtml("Hi there!", ev.target);
  });

  button.addEventListener("mouseleave", (ev) => {
      bubble.delayedHide();
  });
</script>