EN
Este contenido no se encuentra disponible en su idioma, pero aquí tiene la versión en inglés.

Tooltip.contentElement property

Applies to Windows only

Gets or sets the HTML element that is the content of the Tooltip.

Syntax


<div data-win-control="WinJS.UI.Tooltip" data-win-options="{ contentElement : 'idOfContentElement'}" ></div>


var contentElement = tooltip.contentElement;
tooltip.contentElement = contentElement;

Property value

Type: HTMLElement

The HTML element that is the content of the Tooltip. When you set this property in HTML, provide the ID of another element on the page.

Examples

If you want your tooltip to contain complex content, such as images, and controls, use the contentElement property. The contentElement property lets you use another element as the content for your Tooltip. Here's an example:


<div data-win-control="WinJS.UI.Tooltip" data-win-options="{infotip: true, contentElement: myContentElement}">
    <a>Box Office No. 1</a>
</div>
<div style="display: none;">
    <!--Here is the content element. 
        It's inside a hidden container so that it's 
        invisible until the tooltip displays it. -->
    <div id="myContentElement">
        <div id="myContentElement_rating">
            <div data-win-control="WinJS.UI.Rating" class="win-small movieRating" data-win-options="{userRating: 3}"></div>
        </div>
        <div id="myContentElement_description">
            <p>
                You could provide any DOM element as content, even with WinJS controls inside. The
                tooltip control will re-parent the element to the tooltip container, and block interaction
                events on that element, since that's not the suggested interaction model.</p>
        </div>
        <div id="myContentElement_picture">
        </div>
    </div>
</div>


When you run the code, it displays the content element as the tooltip.

A tooltip that contains images and a Windows Library for JavaScript control.

For the complete code, see the HTML Tooltip control sample.

Requirements

Minimum supported client

Windows 8 [Windows Store apps only]

Minimum supported server

Windows Server 2012 [Windows Store apps only]

Minimum supported phone

None supported

Namespace

WinJS.UI

Library

Ui.js

See also

Tooltip

 

 

Mostrar:
© 2014 Microsoft