"JQuery" long Press the button

Source: Internet
Author: User

Now the rapid development of mobile phone, so that many mobile phone gestures need to be made to the mobile version of the web process

There are many plug-in buttons on the web, and even jquery Mobile has long-press events

But based on a variety of compatibility issues,

Use jquery only to achieve long-press action, can be very strong compatibility on the phone side and the computer side


I. BASIC OBJECTIVES

Make a button, essentially a 100x100px gray background layer, long press up to 2s the text in the layer becomes out from in.



Second, the production process

The code is as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

In essence, long-press time should not be too long, because it is possible with the phone system part of the long-press gesture conflict, but also not too short, because long by the time too short and click No difference,

In theory, judging the end of the long press, only set the MouseUp action on the phone side can be,

However, only setting MouseUp on the PC will have the following bug:


When the long press at the same time to apply black layer above the text, and then drag the mouse layer, you can avoid the system MouseUp judgment, of course, in the mobile phone cannot achieve this action, if it is completely written to the mobile phone Web page, completely can regardless of this step, but for better compatibility, or add mouseout action to fix this bug.

"JQuery" long Press the button

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.