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

swipe-to-refresh

Package Overview
Dependencies
Maintainers
1
Versions
7
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

swipe-to-refresh

A WebComponent to pull the window down and refresh

  • 1.0.8
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
2
decreased by-66.67%
Maintainers
1
Weekly downloads
 
Created
Source

swipe-to-refresh

ES6 TypeScript License Published on webcomponents.org

NPM

A WebComponent to pull the window down and refresh

Demo image

Install

$ npm install swipe-to-refresh

Syntax

<html lang="en">

<head>
  <script src="swipe-refresh.js"></script>
  <script>
    function doRefresh() {
      console.log("Refresh!!");
    }
    function init() {
      document.querySelector("swipe-refresh").refresh = doRefresh;
    }
  </script>
</head>

<body onload="init()">
  <swipe-refresh></swipe-refresh>
  <div style="width: 100%; height: 150vh;"></div>
</body>

</html>

Demo page

The demo page: https://yishiashia.github.io/swipe-to-refresh/

Usage

If you want to customize this web component, you can import the library and implement your new class by extend SwipeToRefresh.

import SwipeToRefresh from "swipe-to-refresh";

class customizedSwipeToRefresh extends SwipeToRefresh {
    // override here
}

Options

pull-text (optional)

The hint message to ask user pull down the page. Default value is "Swipe to refresh".

drop-text (optional)

The hint message when user pull distance is larger than threshold. Default value is "Release to refresh".

refresh-text (optional)

The hint message when executing the refresh function. Default value is "Refreshing".

finish-text (optional)

The hint message after finish execuing refresh function. Default value is "Updates".

Keywords

FAQs

Package last updated on 25 Dec 2023

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