responsivewebframework
Version:
Jalasoft Foundation Front End Framework ========================================
30 lines (29 loc) • 1.79 kB
HTML
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Tooltip</title>
<link rel="stylesheet" href="../../../dist/css/frontend-framework.min.css">
<script type="text/javascript" src="../vendor/jquery.min.js"></script>
<script type="text/javascript" src="../../../src/js/tooltip.js"></script>
</head>
<body>
<div>
<h3>Example</h3>
<input type="text" class="textbox-x1" placeholder="Right" data-toggle="tooltip" data-placement="right" title="Example the Tooltip on Right" data-icon="warning"/>
<br/>
<br/>
<input type="text" class="textbox-x1" placeholder="Top" data-toggle="tooltip" data-placement="top" title="Tooltip on top" data-icon="info"/>
<br/>
<br/>
<input type="text" class="textbox-x1" placeholder="Bottom" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom" data-icon="error"/>
<br/>
<br/>
<input type="text" class="textbox-x1" placeholder="Left" data-toggle="tooltip" data-placement="left" title="Tooltip on Left"/>
<br/>
<br/>
<input type="text" class="textbox-x1" placeholder="Other Icons" data-toggle="tooltip" data-placement="right" title="Tooltip other icon icon icon" data-icon="settings"/>
<p><span data-toggle="tooltip" data-placement="left" title="Lorem Ipsum is simply dummy text">Examples</span> of tooltip, <span data-toggle="tooltip" data-placement="left" title="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.">this</span> is other <span data-toggle="tooltip" data-placement="left" title="Tooltip other example">example</span></p>
</div>
</body>
</html>