Gathering detailed insights and metrics for combine-vue-tiny-slider
Gathering detailed insights and metrics for combine-vue-tiny-slider
Vanilla javascript slider for all purposes created by ganlanyuan in Vue.
Installations
npm install combine-vue-tiny-sliderDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Node Version
16.15.1
NPM Version
9.6.6
Releases
Unable to fetch releases
Languages
1
JavaScript
JavaScript (100%)
Developer
viktorlarsson
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
MIT License
133 Stars
159 Commits
49 Forks
7 Watchers
8 Branches
10 Contributors
Updated on Feb 01, 2025
Maintainers
1
Package Meta Information
Latest Version
0.1.39
Package Id
combine-vue-tiny-slider@0.1.39
Unpacked Size
51.56 kB
Size
18.78 kB
File Count
8
NPM Version
9.6.6
Node Version
16.15.1
Published on
Sep 27, 2023
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
2
Dev Dependencies
5
tiny-slider 2.0 for Vue
Wrapper for Tiny slider for all purposes by ganlanyuan in Vue. Try it out!
Firefox 12+, Chrome 15+, Safari 4+, Opera 12.1+, IE8+
Table of Contents
Install
npm install vue-tiny-slider
Use
1import VueTinySlider from 'vue-tiny-slider'; 2 3new Vue({ 4 components: { 5 'tiny-slider': VueTinySlider 6 } 7})
1<tiny-slider :mouse-drag="true" :loop="false" items="2" gutter="20"> 2 <div>Slider item #1</div> 3 <div>Slider item #2</div> 4 <div>Slider item #3</div> 5 <div>Slider item #4</div> 6 <div>Slider item #5</div> 7 <div>Slider item #6</div> 8</tiny-slider>
Styling
SCSS
1@import 'tiny-slider/src/tiny-slider';
CDN
1<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.1/tiny-slider.css">
Options
auto-init
items
mode
gutter
edge-padding
fixed-width
slide-by
controls
controls-text
controls-container
nav
nav-container
arrow-keys
speed
autoplay
autoplay-timeout
autoplay-direction
autoplay-text
autoplay-hover-pause
autoplay-button
autoplay-button-output
autoplay-reset-on-visibility
animate-in
animate-out
animate-normal
animate-delay
loop
rewind
auto-height
responsive
lazyload
touch
mouse-drag
nested
freezable
disable
on-init
center
lazy-load-selector
prevent-action-when-running
prevent-scroll-on-touch
nav-options
auto-width
For more detailed information about the options, see the Tiny-slider documentation (Options).
Methods
getInfo
goTo
destroy
How to use the methods
To be able to use the methods, you need to use ref on the component. Ref is used to register a reference to an element or a child component.
<vue-tiny-slider ref="tinySlider"></vue-tiny-slider>
import VueTinySlider from 'vue-tiny-slider';
export default {
...,
methods: {
getInfo: function(event) {
this.$refs.tinySlider.slider.getInfo();
}
}
}
For more detailed information about the methods, see the Tiny-slider documentation (Methods).
NuxtJS SSR
-
yarn add vue-tiny-sliderornpm install vue-tiny-slider -
In
nuxt.config.jsadd
1plugins: [{ src: '~/plugins/vue-tiny-slider.js', mode: 'client' }],
- Create the file
plugins/vue-tiny-slider.jswith this content
1import Vue from 'vue' 2import vTinySlider from 'vue-tiny-slider' 3const VueTinySlider = { 4 install(Vue, options) { 5 Vue.component('VueTinySlider', vTinySlider) 6 } 7} 8Vue.use(VueTinySlider)
Now you should be able to use it in any component without any import, like this:
1<no-ssr> 2 <vue-tiny-slider v-bind="tinySliderOptions"> 3 <div>#1</div> 4 <div>#2</div> 5 <div>#3</div> 6 <div>#4</div> 7 <div>#5</div> 8 <div>#6</div> 9 </vue-tiny-slider> 10</no-ssr>
A demo is available here: https://codesandbox.io/s/jvjp349449.
Todo
Add demo link from a fiddle or something similar- Better handling of the responsive-settings
- Add Custom Events
Add Methods
Collaborators
License
This project is available under the MIT license.
Cheerios <3
- Fixed broken demo link, @VitorLuizC
- Moved tiny-slider from devDependencies to dependencies, @TitanFighter
- Added nav position to props, @Irsanarisandy
- Got it to work with NuxtJS SSR, @ilbonte
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
Found 3/10 approved changesets -- score normalized to 3
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 23 are checked with a SAST tool
Reason
56 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
- Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx
- Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw
- Warn: Project is vulnerable to: GHSA-c6rq-rjc2-86v2
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-phwq-j96m-2c2q
- Warn: Project is vulnerable to: GHSA-ghr5-ch3p-vcr6
- Warn: Project is vulnerable to: GHSA-434g-2637-qmqr
- Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m
- Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw
- Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p
- Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747
- Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh
- Warn: Project is vulnerable to: GHSA-8r6j-v8pm-fqw3
- Warn: Project is vulnerable to: MAL-2023-462
- Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97
- Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj
- Warn: Project is vulnerable to: GHSA-rc47-6667-2j5j
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-4xcv-9jjx-gfj3
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
- Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6
- Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-h9rv-jmmf-4pgx
- Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94
- Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6
- Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj
- Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq
- Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9
- Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw
- Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc
- Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh
- Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p
- Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
- Warn: Project is vulnerable to: GHSA-cf4h-3jhx-xvhq
- Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp
Score
2.1
/10
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More