CODEWITHSUNDEEP
javascriptjqueryjquery-mobile
Brad
Brad

Reputation: 1047

Prevent double tap from selecting text

I have made a jQuery mobile widget which has a minus button on the left and a plus button on the right and a div in the middle with a number which gets updated after either the plus or minus buttons is pushed. It's essentially just a "quantity" selector.

The problem is that when either button is pressed too frequently (if you wanted to add a couple of items quickly) then it selects other text on the page, as in the screenshot.

Can anyone think of a way of preventing this?

enter image description here

Upvotes: 2

Views: 497

Answers (2)

ReaperSoon
ReaperSoon

Reputation: 839

You have to prevent text selection in your buttons :

Here is a cross-compatible CSS class

.noselect {
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

And add this class to all your element you want to not be selectable.

Upvotes: 2

Neikos
Neikos

Reputation: 1980

It seems what you are looking for is user-select

For more information you can also check this answer: How to disable text selection highlighting using CSS?

Upvotes: 1

Related Questions