$(document).puitooltip();
Name | Type | Default | Description |
---|---|---|---|
showEvent | string | mouseover | Event to show the tooltip. |
hideEvent | string | mouseout | Event to hide the tooltip. |
showEffect | string | fade | Effect to display when showing the tooltip. |
showEffect | string | null | Effect to display when hiding the tooltip. |
showEffectSpeed | int/string | normal | Speed in milliseconds or keywords like slow, normal and fast. |
hideEffectSpeed | int/string | normal | Speed in milliseconds or keywords like slow, normal and fast. |
my | string | left top | Corner of tooltip relative to target. |
at | string | right bottom | Corner of target relative to tooltip. |
showDelay | int | 150 | Delay in milliseconds before showing the tooltip. |
Name | Parameters | Description |
---|---|---|
show | - | Displays the tooltip. |
hide | - | Hides the tooltip. |
option | name: Name of the option | Returns the value of the option. |
option | name: Name of the option, value: Value of the option | Set the value of the option. |
$(function() { $('#in').puiinputtext(); $('#btn').puibutton(); $(document).puitooltip(); $('#in').puitooltip({ showEvent: 'focus', at: 'left bottom', content: '<img src="./resources/demo/images/galleria/galleria5.jpg" />' }); });
<h3 class="first">Button</h3> <button type="button" id="btn" title="Lorem ipsum dolor sit amet">Save</button> <h3>Image</h3> <img src="./resources/demo/images/galleria/galleria1.jpg" title="Sed do eiusmod tempor incididunt" /> <h3>Link</h3> <a href="#" title="Consectetur adipisicing elit">Hover me!</a> <h3>Customized</h3> <input type="text" id="in" name="in" value="Focus me!"/>