Menu
I am trying angular + scrollbar [https://github.com/iominh/ng-scrollbars], however not able to make it work. It just gives module error and show text. in codepen it doesn't even show text. any help Plunker and codepan
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.0/jquery.mCustomScrollbar.min.css" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.0/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="https://raw.githubusercontent.com/iominh/ng-scrollbars/master/src/scrollbars.js"></script>
<script>
var app = angular.module('app', ['ngScrollbars']);
app.config(function(ScrollBarsProvider) {
// scrollbar defaults
ScrollBarsProvider.defaults = {
autoHideScrollbar: false,
setHeight: 100,
scrollInertia: 0,
axis: 'yx',
advanced: {
updateOnContentResize: true
},
scrollButtons: {
scrollAmount: 'auto', // scroll amount when button pressed
enable: true // enable scrolling buttons by default
}
};
});
function MainController($scope) {
// example of overriding defaults per scrollbar
$scope.scrollbarConfig = {
theme: 'dark',
scrollInertia: 500
}
}
app.controller('mainCtrl', MainController);
</script>
</head>
<body ng-app="app" ng-controller="mainCtrl">
<div style="width: 200px;" ng-scrollbars ng-scrollbars-config="scrollbarConfig">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare magna ultrices tincidunt tincidunt. Donec sagittis lorem placerat iaculis vehicula. Nunc bibendum quam vel rutrum rutrum. Duis nunc dolor, vehicula vitae pulvinar eu, semper vitae eros.
Proin auctor, felis placerat posuere dictum, massa ipsum fermentum ipsum, sit amet tincidunt metus justo ut dui. Curabitur aliquet tempor dolor eget volutpat. Proin consequat metus id justo interdum, id porta justo venenatis. Nullam vel tristique
neque, at luctus velit. Nulla sit amet convallis felis.
</div>
</body>
</html>
861
Updated your codepen with 3 changes: codepen
https://rawgit.com/iominh/ng-scrollbars/master/src/scrollbars.js
You misspelled the directive: ng-scrollbars (note the last 's')
The height CSS needs to be in the same level with the directive.
<ul ng-scrollbars style = "height: 100px;">
140
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
