Tag: Scrollbar

Latest free Vue.js scrollbar components to customize and handle scrollbars in your Vue application.

Scrollable Content With Custom Scrollbar – scrollbar-live

scrollbar-live is a Vue.js component for creating scrollable content with custom scrollbars that support server-side rendering. How to use it: Import the VueScrollbar from the package. import VueScrollbar from ‘vue-scrollbar-live’; import ‘vue-scrollbar-live/lib/css/index.css’; Use the component. new Vue({ el: ‘#example’, template: ‘<scrollbar :maxHeight=”\’50vh\'”‘ + ‘ :isMobile=”isMobile”‘ + ‘ @reachBottom=”log(\’Reach bottom\’)”‘ + ‘ @reachTop=”log(\’Reach top\’)”‘ + ‘ @startDrag=”log(\’Drag start\’)”‘ + ‘ @endDrag=”log(\’Drag end\’)”>’ + ‘ <div class=”content” style=”width:100vw;height:100vh;” @click=”log”>Scroll Content</div>’ + ‘</scrollbar>’, data: function () { return { isMobile: /Android|webOS|iPhone|iPod|iPad|BlackBerry|Windows Phone/i.test(navigator.userAgent) } }, methods: { log: function (e) { console.log(e || 1) } }, components: { ‘scrollbar’: VueScrollbar } }) Default props.