3

I am quite new in Angular world. I am working on an application which involves Angular JS. I've been confronted with the requirement to implement custom scrollbar. My application does have jQuery too, but so far most part of my project uses Angular. So should I be using some jQuery widget or implement it via Angular.

If Angular, can you provide me pointers on how should I proceed?

isherwood
  • 58,414
  • 16
  • 114
  • 157
Anup Vasudeva
  • 871
  • 2
  • 12
  • 31

2 Answers2

5

You should probably implement it in the Angular way, i.e., building / using a custom Angular's directive:

http://docs.angularjs.org/guide/directive

Learning resources for Angular:

https://github.com/jmcunningham/AngularJS-Learning

You can always use jQuery plugins / widgets in an Angular app, but in that case the best way is to encapsulate each plugin within a directive. Angular-UI is a project which does that for several components, including Twitter Bootstrap:

http://angular-ui.github.io/

I'm aware of angular-perfect-scrollbar, a simple Angular's directive for perfect-scrollbar, but haven't tested it yet:

https://github.com/itsdrewmiller/angular-perfect-scrollbar

http://www.yuiazu.net/perfect-scrollbar/

flsilva
  • 111
  • 1
  • 4
  • Let me add one more scrollbar to the list - [jQuery Scrollbar](https://github.com/gromo/jquery.scrollbar) which has integration with AngularJS – Gromo Jul 17 '14 at 14:58
3

Depending on what your requirements are, you can style your scrollbars strictly in CSS and not need any JavaScript:

http://css-tricks.com/custom-scrollbars-in-webkit/

Langdon
  • 19,875
  • 18
  • 88
  • 107
  • 1
    Thanks Langdon. But seems it's meant for webkits only and won't work in IE. Any other option? – Anup Vasudeva May 31 '13 at 04:15
  • @AnupVasudeva There's no equivalent in FireFox (see http://stackoverflow.com/questions/6165472/custom-css-scrollbar-for-firefox). For IE, you have a limited subset (see http://msdn.microsoft.com/en-us/library/ff974092%28v=vs.85%29.aspx) – Langdon Jun 02 '13 at 20:01