Tuesday, April 3, 2012

CSS3 ::selection

While working on some stuff I cam across a CSS3 pseudo-class selector called ::selection. While this is something you can do in javascript, it makes things a lot easier when styling can all be done in CSS rather than javascript workarounds. The javascript equivalent would be rather annoying to do. So the CSS3 way, as with any CSS, is rather simple and quick to do, minus a few catches here and there. CSS3 still lacks a good deal of support and isn't good if you want some real backwards compatibility, however I'm more interested in how to use this to just screw with things in ways it could be exploited, bad or just annoying and this particular property hit right on the head for some annoying fun.

You may wonder how this could be annoying, and quite simply, think about what would happen if selected text disappears. It would no longer be selected and then have to reappear, unselected. Thus the end result is text you cannot highlight without altering the CSS. So the code for that looks something like this.
::selection {
  display: none;
::-moz-selection {
  display: none;

I've only tried this in Firefox 10, but when I do it on Firefox, the text is impossible to highlight, however I can drag the text. As to the effects it will have in other browsers that support it, well that's all part in the fun in trying to mess with things to get results like this.

Try to highlight this and see what happens if your browser supports it.

No comments:

Post a Comment

Tag Cloud

.NET (2) A+ (5) ad ds (1) addon (4) Android (4) anonymous functions (1) application (9) arduino (1) artificial intelligence (1) backup (1) bash (6) camera (2) certifications (3) comptia (5) css (2) customize (11) encryption (3) error (13) exploit (5) ftp (1) funny (4) gadget (4) games (3) GUI (5) hardware (16) haskell (6) help (14) HTML (3) imaging (2) irc (1) it (1) java (2) javascript (13) jobs (1) Linux (19) lua (1) Mac (4) malware (1) math (6) msp (1) network (13) perl (2) php (3) plugin (2) powershell (8) privacy (2) programming (24) python (10) radio (2) regex (3) repair (2) security (16) sound (2) speakers (2) ssh (1) story (5) Techs from the Crypt (5) telnet (1) tools (13) troubleshooting (11) tutorial (9) Ubuntu (4) Unix (2) virtualization (2) web design (6) Windows (16) world of warcraft (1) wow (1) wx (1)