1 December, 2014
0 Comments
1 category
Code can be found at:
http://plnkr.co/edit/xarxPAKTXrEIDKUHmapg?p=preview
I was asked to show a tooltip with AngularJS in a responsive layout, so I created a Plunker, that will form the base of my code.
Note: resize the screen to test the responsiveness.
Initial state
Clicked on Tile 3
HTML
<body> <div ng-controller="main"> <br> {{ title }} <br> Just click on one of the tiles to show the tooltip. <br> <br> <div class="header"> Modules </div> <div class="tiles"> <div class="tile" ng-class="{ marker: tile.showToolTip }" ng-click="onTileClick(tile)" ng-repeat-start="tile in tiles"> {{ tile.title }} </div> <div class="wizard fadeSlideIn" ng-show="tile.showToolTip" ng-repeat-end> <div class="close">X</div> <div>{{ tile.title }}</div> <div style="clear: both"></div> </div> </div> </div> </body>
Tags: AngularJS
Category: Uncategorized