JavaScript
Article

jQuery Highlight Text

By Sam Deering

Simple jQuery and CSS code snippets to highlight text on page in order to select it for copy or it could be used in combination with a search script to show where matches are found on a page.


Note: CSS3-only feature (only Firefox and Safari too as far as I know).

::selection {
    background: #ffb7b7; /* Safari */
}
::-moz-selection {
    background: #ffb7b7; /* Firefox */
}

Or use a textbox:


function selectAllText(textbox) {
    textbox.focus();
    textbox.select();
}
jQuery('#txtInput').click(function() { selectAllText(jQuery(this)) });

Free Guide:

7 Habits of Successful CTOs

"What makes a great CTO?" Engineering skills? Business savvy? An innate tendency to channel a mythical creature (ahem, unicorn)? All of the above? Discover the top traits of the most successful CTOs in this free guide.

  • Jerry

    Your online demos seem to be pointing to that json tree viewer – past couple of times…

    • jquery4u

      Hi Jerry, good spot! My bad, i’ll update the right demo link.

Recommended
Sponsors
Because We Like You
Free Ebooks!

Grab SitePoint's top 10 web dev and design ebooks, completely free!

Get the latest in JavaScript, once a week, for free.