New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →

long-press-event

Package Overview

Dependencies

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

long-press-event

A 1k script that adds a long-press event to the DOM using pure JS

2.5.0
latest
Source
npm

Version published: 10 months ago

Weekly downloads: 2.7K; decreased by-13.93%

Maintainers: 1

Weekly downloads

Created: 6 years ago

Source

long-press-event

A 1k script that adds a long-press event to the DOM using CustomEvent and pure JavaScript. Works in IE9+, Chrome, Firefox, Safari as well as popular mobile browsers including Cordova (Phone Gap) applications.

Defaults to 1.5 seconds but can be overridden by adding a data-long-press-delay attribute to an element.

Try the demo

Usage

Add the long-press-event.min.js file to your page and then listen for the event.

To listen for a long-press on any HTML element:

// the event bubbles, so you can listen at the root level
document.addEventListener('long-press', function(e) {
  console.log(e.target);
});

To listen for a long-press on a specific HTML element:

// grab the element
var el = document.getElementById('idOfElement');

// listen for the long-press event
el.addEventListener('long-press', function(e) {

  // stop the event from bubbling up
  e.preventDefault()

  console.log(e.target);
});

To set a custom delay and listen for a long-press:

<html>
    <head>
        <script src="long-press-event.js"></script>
        <script>
            document.addEventListener('long-press', function(e) {
                console.log(e.target);
            });
        </script>
    </head>
    <body>
        <div data-long-press-delay="500">Press and hold me for .5s</div>
    </body>
</html>

To set a default application wide data-long-press-delay, set attribute on a parent/topmost element:

<html data-long-press-delay="1500">
    <head>...</head>
    <body>...</body>
</html>

Contributing

Fork it!
Create your feature branch: git checkout -b my-new-feature
Commit your changes: git commit -m 'Add some feature'
Push to the branch: git push origin my-new-feature
Submit a pull request

Development

The project includes everything needed to tweak, including a node webserver. Run the following, then visit http://localhost:8080 in your browser.

You can test on a desktop using Device Mode in Google Chrome.

git clone https://github.com/john-doherty/long-press-event
cd long-press
npm install
npm start

Update .min files

Update long-press-event.min.js by tweaking the version number in package.json and running:

npm run build

Star the repo

If you find this useful, please star the repo. It helps me prioritise which open source issues to tackle first.

History

For change-log, check releases.

License

Keywords

FAQs

What is long-press-event?

Is long-press-event popular?

Is long-press-event well maintained?

Package last updated on 27 Apr 2024

Did you know?

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