Is it possible to disable Ctrl + F of find in page?

Question

I have a puzzle site and its an awful way of cheating. Its okay if only partially, but can it be done?
Something I had in mind was replacing the letters with images, but

Answer 1

you can do it with javascript - this is only pseudocode (written in jQuery) as I'm not certain how to listen for both a ctrl AND an f, but you get the idea:

$(body).keypress(function(e)
{
    if (e.keyCode===17)
    {
        //ctrl has been pressed, listen for subsequent F press (keyCode 70)
        //if next keyCode===70
        return false;
    }
});

Returning false like this will stop the browser doing anything when the keys are pressed, as far as I know. you could also use e.preventDefault(); to try to prevent anything happening if return false; isn't enough.

Hope this helps

Answer 2

Rather than disable the Find function, you could make it so that Find won't find the words! One way to do this would be to use the CSS content declaration to inject the words. Find won't find them:

<div class="word-foobar"></div>

.word-foobar:before {
    content: "Foobar";
}

You could quite easily write some Javascript to automatically generate all the necessary CSS rules for you, too.

Answer 3

Code

window.addEventListener("keydown",function (e) {
    if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) { 
        e.preventDefault();
    }
})

Answer 4

I would presume that using keydown would enable this, however as a matter of principle, changing the way that a browser behaves is a bad idea. Although it is more of a pain for you to do, there are font replacement techniques that should make it easier.

If you do find a means of doing this, there is always a danger that someone will get around it. It is far better to write the page to work whatever than hack the browser.

Answer 5

Here's a jQuery plugin that does what you're looking for.

Answer 6

Why not use the Shadow DOM ? This will allow your content to be inaccessible by search engines or screen readers. And has the added bonus of having the exact same behavior for the user.

Take a look here for more info: Introduction to Shadow DOM