Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

scoochjs

Package Overview
Dependencies
Maintainers
1
Versions
5
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

scoochjs

A really lightweight, customisable vanilla Javascript carousel

  • 0.2.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
14
Maintainers
1
Weekly downloads
 
Created
Source

Scooch

Scooch makes slideshows easy. You bring your own content and styling. It's super lightweight, around 1kb gzipped and easy to customise.

Installation

You can either download the repo, grab the JS and CSS and link them in your HTML, or if you prefer, you can install via NPM:

npm install scoochjs --save

Usage

See demo in index.html for a setup guide.

Options

You can pass an optional object to set any of the below items, as the second parameter, when instantiating Scooch.

e.g.

new Scooch(element, { autoplay: false });
KeyDescriptionDefault Value
autoplayMove to the next slide automaticallyfalse
autoplayIntervalHow often (in MS) to change slide, if autoplay is true5000
keyboardControlsEnable keyboard controlstrue
enableFullscreenAllow the slideshow to be made fullscreentrue

Methods

MethodDescription
next()Go to the next slide
previous()Go to the previous slide
goToSlide(index)Go to specific slide. index should be the array index of the slide to goto.

Keyboard Controls

  • Next Slide: Right arrow, space
  • Previous Slide: Left arrow
  • Enter Fullscreen: F
  • Exit Fullscreen: esc

💡 Tip: Hover over the left bottom corner of the index.html demo page to see keyboard controls.

Roadmap

  • Add lifecycle events (e.g. init, onSlideChange etc.)
  • Make fullscreen only affect slideshow element

FAQs

Package last updated on 08 Sep 2020

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc