thalassa-aqueduct
Version:
Dynamic haproxy load balancer and configuration. Part of Thalassa
34 lines (32 loc) • 1.68 kB
HTML
<div ng-controller="TooltipDemoCtrl">
<div class="well">
<div>Dynamic Tooltip Text: <input type="text" ng-model="dynamicTooltipText"></div>
<div>Dynamic Tooltip Popup Text: <input type="text" ng-model="dynamicTooltip"></div>
<p>
Pellentesque <a><span tooltip="{{dynamicTooltip}}">{{dynamicTooltipText}}</span></a>,
sit amet venenatis urna cursus eget nunc scelerisque viverra mauris, in
aliquam. Tincidunt lobortis feugiat vivamus at
<a><span tooltip-placement="left" tooltip="On the Left!">left</span></a> eget
arcu dictum varius duis at consectetur lorem. Vitae elementum curabitur
<a><span tooltip-placement="right" tooltip="On the Right!">right</span></a>
nunc sed velit dignissim sodales ut eu sem integer vitae. Turpis egestas
<a><span tooltip-placement="bottom" tooltip="On the Bottom!">bottom</span></a>
pharetra convallis posuere morbi leo urna,
<a><span tooltip-placement="mouse" tooltip="relative to mouse">mouse</span></a>
blah blah blah,
<a><span tooltip-animation="false" tooltip="I don't fade. :-(">fading</span></a>
at elementum eu, facilisis sed odio morbi quis commodo odio. In cursus
<a><span tooltip-popup-delay='1000' tooltip='appears with delay'>delayed</span></a> turpis massa tincidunt dui ut.
</p>
<p>
I can even contain HTML. <a><span tooltip-html-unsafe="{{htmlTooltip}}">Check me out!</span></a>
</p>
<p>
Or use custom triggers, like focus:
<input type="text" value="Click me!"
tooltip="See? Now click away..."
tooltip-trigger="focus"
tooltip-placement="right" />
</p>
</div>
</div>