javascript - Scrollbar directive not working in Angularjs -
i'm trying use ng-scrollbar in project implementing scrollbar somehow it's not working me. have included following files in index.html:
<link rel="stylesheet" href="bower_components/ng-scrollbar/dist/ng-scrollbar.css" /> <script src="bower_components/ng-scrollbar/dist/ng-scrollbar.js"></script>
also, jade template looks this:
<li id="notification-button" class="dropdown notifications-menu"><a href="#notifications" data-toggle="dropdown" aria-expanded="false" class="dropdown-toggle"><i class="fa fa-bell-o"></i><span class="label label-warning">{{user.notifications.count}}</span></a> <ul class="dropdown-menu"> <li class="header">{{user.notifications.count}} notifications.</li> <li> <div ng-scrollbar="ng-scrollbar"> <ul style="overflow: hidden; width: 100%; height: auto;" class="menu"> <li ng-repeat="notification in user.notifications"><a href="#"><i class="fa fa-users text-aqua"></i>{{notification.text}}</a></li> </ul> </div> </li> <li class="footter"><a href="#">view all</a></li> </ul> </li>
my css corresponding block looks like:
.navbar-nav > .notifications-menu { > .dropdown-menu > li .menu { // links inside menu > li > { color: #444444; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 10px; // icons inside menu > .glyphicon, > .fa, > .ion { width: 20px; } } } }
for exact css, can take @ https://almsaeedstudio.com/preview. i'm trying implement notification icon scrollbar functionality.
can please tell me doing wrong ? it'll great if can give me simple example of how use ?
p.s. : https://github.com/asafdav/ng-scrollbar
thanks
Comments
Post a Comment