CODEWITHSUNDEEP
javascriptiphonemobile-safari
pop850
pop850

Reputation: 3157

how to disable MobileSafari auto-selection?

my webapp requires users to tap and hold on an element for a game action,
but iPhone automatically "selects" the area which is confusing to the user.

anyone know what html elements prevent selection, or if javascript can block selection?

any help is appreciated

Upvotes: 19

Views: 12761

Answers (2)

davemyron
davemyron

Reputation: 2542

SLaks answer is obviously right - I just want to extend it a bit for future viewers. If you're using jQuery, here's a useful extension method that disables selection in various browsers:

$.fn.extend({ 
        disableSelection : function() { 
                this.each(function() { 
                        this.onselectstart = function() { return false; }; 
                        this.unselectable = "on"; 
                        $(this).css('-moz-user-select', 'none'); 
                        $(this).css('-webkit-user-select', 'none'); 
                }); 
        } 
});

Upvotes: 14

SLaks
SLaks

Reputation: 887365

Try handling the selectstart event and returning false.

Try applying the CSS rule, -webkit-user-select: none;

Upvotes: 35

Related Questions