non-selectable html?

nerssi · June 22nd, 2005, 06:11 AM

Hi all,
How can I make a text or table in an html document non-selectable? In other words how can I prevent an html item to be selected(highlighted blue in IE) while pressing and draging the mouse on it?Is there any style to do the job?

joefawcett · June 22nd, 2005, 10:48 AM

In IE you can set unselectable="on" in the body tag. You could also try ondragstart="return false;" in the body element.

--

Joe (Microsoft MVP - XML)

nerssi · June 23rd, 2005, 07:34 AM

What about other browsers?

richard.york · June 23rd, 2005, 09:22 AM

In Mozilla, Netscape, and Mozilla Firefox you can do something like this in a style sheet:

::-moz-selection {
   background: transparent;
   color: inherit;
}

That just makes the selection invisible, there is still a selection though.

Safari, I think, supports ::selection, therefore you can do this in Safari, and possibly Konquorer as well.

::selection {
   background: transparent;
   color: inherit;
}

Don't know though, haven't tested it.

Regards,
Rich

--
[http://www.smilingsouls.net]
Mail_IMAP: A PHP/C-Client/PEAR solution for webmail
Author: Beginning CSS: Cascading Style Sheets For Web Design

richard.york · June 23rd, 2005, 09:33 AM

BTW, the two selection psuedo-elements cannot be grouped. For instance:

::-moz-selection, ::selection {
background: transparent;
color: inherit;
}

This doesn't work in Mozilla, it completely ignores the rule.

Regards,
Rich

--
[http://www.smilingsouls.net]
Mail_IMAP: A PHP/C-Client/PEAR solution for webmail
Author: Beginning CSS: Cascading Style Sheets For Web Design

nerssi · June 26th, 2005, 02:24 AM

Thanks but I'm using the following code instead:

<html>
<head>
</head>
<body onload="window.setInterval('document.selection.emp ty()',100);">
some text
</body>
</html>

Not sure if there's any equivalant code for other browsers...

nzakas · June 27th, 2005, 10:56 AM

What you actually want to do in Mozilla is this:

Code:

* {
    -moz-user-select:none;
}

In IE, the best way to do it is to use onselectstart:

Code:

<body onselectstart="return false">

Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/

joefawcett · June 27th, 2005, 11:07 AM

Quote:

quote:Originally posted by nzakas

In IE, the best way to do it is to use onselectstart:

Code:

<body onselectstart="return false">

Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/

Yes sorry nerssi, "onselectstart" was what I meant, not sure where "ondragstart" came from :)

--

Joe (Microsoft MVP - XML)

interrupt · August 5th, 2005, 05:04 AM

ondragstart is in VBA :)

darkshaped · January 13th, 2008, 07:30 PM

1 javascript line solution:

firefox/mozilla/iexplore:

Code:

nonselectableobject.onmousedown = nonselectableobject.onselectstart = function(){return false;}