jqwidgets-scripts-custom
Version:
jQWidgets is an advanced jQuery, Angular 7, Vue, React, ASP .NET MVC, Custom Elements and HTML5 UI framework.
31 lines (26 loc) • 1.75 kB
HTML
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title id='Description'>
ReactJS Tooltip demo. jqxTooltip supports 12 built-in position modes: "top, bottom, left, right, top-left, bottom-left, top-right, bottom-right, absolute, mouse, mouseenter, default".
In this demo, the tooltip for the first movie will be displayed from its 'left' side.
The tooltip for the second movie will be displayed below the picture and the tooltip for the third movie will be displayed on its 'right' side.
</title>
<meta name="description" content="This React Tooltip demo showcases how to configure the positioning of the React Tooltip"/>
<link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxtooltip.js"></script>
<script type="text/javascript" src="../../../scripts/demos.js"></script>
</head>
<body>
<div class="example-description" style="margin-bottom: 3em">
ReactJS Tooltip demo. jqxTooltip supports 12 built-in position modes: "top, bottom, left, right, top-left, bottom-left, top-right, bottom-right, absolute, mouse, mouseenter, default".
In this demo, the tooltip for the first movie will be displayed from its 'left' side.
The tooltip for the second movie will be displayed below the picture and the tooltip for the third movie will be displayed on its 'right' side.
</div>
<div id="app"></div>
<script src="../build/tooltip_tooltippositions.bundle.js"></script>
</body>
</html>