Jctk-page-preview-scrollbar NPM

Page Preview Scrollbar

A scrollbar with current page preview for Vue2.

Installation

npm install -D jctk-page-preview-scrollbar
npm install @vue/composition-api

Usage

// main.js
import 'jctk-page-preview-scrollbar'
import 'jctk-page-preview-scrollbar/dist/jctk-page-preview-scrollbar.css'
import VueCompositionAPI from '@vue/composition-api'

Vue.use(VueCompositionAPI)

In your component.

<template>
    <PagePreviewScrollbar />
</template>

Why Composition API

Since some mechanism of vue & composition API.

The library deveoped with composition API seems can not run individually without it.

The detail is descriped here.

Configurations

Property	Type	Default	Description
isHideShorterHeight	Boolean	true	Automatically hide the scrollbar when screen is short.
isShowCloseButton	Boolean	true	Display the buton which can close scrollbar.
isAutoOpacity	Boolean	true	Make the scrollbar transparent.
persist	Boolean	true	Force the scrollbar always appeared/disappeared.
repaintAnimation	Boolean	true	Add transition animation when repaint.
isResizeAutoRepaint	Boolean	false	Auto repain when sceen height or width resizes.
disableRepaint	Boolean	false	Set true to avoid performance decreased by repainting.
zIndex	Number	100	css z-index.
targetSelector	String	"html"	The element used to preview.
elementToRmoveSelectors	Array	[]	The elements should not appear in scrollbar.
throttle	Number	25
debounceRepaint	Number	1000