How to fit nicescroll to unrendered element

Question

I am using custom version of jQuery NiceScroll in the application I work on. The element which holds the scroll-bar has not finished rendering. Unfortunately the scroll-bar is not placed in the proper position when the element finishes its rendering.

My implementation:

(function (angular) {
    'use strict';

    function myScrollDirective() {
        function linkFunc(scope, element, attrs) {
            var config: any =
                {
                    horizrailenabled: attrs.enableHorizontalScroll ? true : false
                };

            element.niceScroll(config);
        }

        let directive =
            {
                link: linkFunc,
                restrict: 'A'
            };

        return directive;
    }

    angular
        .module('app')
        .directive('myScroll',
        [
            nvScrollDirective
        ]);

})(angular);

After scrolling a bit the scroll-bar gets to the proper position.

How can I make the scroll-bar get to the proper position in the first place, after the element has finished rendering?

Thanks in advance

Answer 1

you can try to style it to the position

.scroll_class {
   position: fixed;
   top: 0;
   right: 0;
   bottom: 0;
}