content Object|String|Function

The text or the function whose result will be shown within the Tooltip. By default, the Tooltip will display the content of the title attribute of the target element. To retrieve the title attribute of the target from inside the content function, use target.data("title").

If the content that is passed to the Tooltip includes scripts, they will be executed. If this is not desired, strip any undesired content in advance.

Example - extracting the content from the target element content

<div id="container">
    <span title="foo">Some content</span>
    <span title="bar">Some more content</span>
</div>

<script>
    $(document).ready(function() {
      $("#container").kendoTooltip({
        filter: "span",
        content: function(e) {
          var target = e.target; // the element for which the tooltip is shown
          return target.data("title") + " " + target.text(); // set the element text as content of the tooltip
        }
      });
    });
</script>

Example - implementing the content as static text

<span id="target">
    Some content
</span>

<script>
    $(document).ready(function() {
      $("#target").kendoTooltip({
        content: "Tooltip content!"
      });
    });
</script>

content.url String

Specifies a URL or a request option from which the Tooltip will load its content.

For URLs which start with a protocol (for example, http://), an iframe container element will be automatically created. This behavior may change in future versions, so it is advisable to always use the iframe configuration option.

Example - loading content from a remote URL

<span id="target" title="Tooltip content">
  Some content
</span>

<script>
  $(document).ready(function() {
    $("#target").kendoTooltip({
      content: {
        url: "https://demos.telerik.com/kendo-ui/content/web/tooltip/ajax/ajaxContent3.html"
      },
      width: 220,
      height: 280
    });
  });
</script>