Press "Enter" to skip to content

Jquery Plugin to Highlight Word Within Content | TUS.Marker

TUS.Marker is an easy and fast jQuery text highlighting plugin to highlight words in paragraphs or characters in strings.

css highlight specific words, html highlight specific words, highlight text in iframe using jquery, highlight part of image javascript, jquery highlight div for a few seconds

Parameters

  • Text – the keyword to highlight.
  • css – specify the class name for the css purpose.
  • Case Sensitive – Controls case sensitivity while searching. The default is true.
  • inWord – to find keywords within a string. default error.

How to make use of it:

1. Include jquery.textmarker.js after jQuery.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jquery.tusmarker.js"></script>

. Highlight the words in the paragraphs and apply a custom CSS class to the matching words.

$('#content').tusmarker({<br>  text: "anyWord",
  css: "highlight",
});

3. Then you can apply custom patterns to the words.

.highlight {
  font-weight: bold;
  color:#fff;
  background: #4F46E5;
  padding: 2px;
  border-radius: 2px;
}

4. Highlight words that include specific letters instead.

$('#content').tusmarker({<br>  text: "anyCharacter",
  css: "highlight",
  inWord: true,
});

5. Determine whether uppercase and lowercase letters are treated as distinct (case-sensitive) or equivalent (case-insensitive).

$('#content').tusmarker({<br>  text: "anyCharacter",
  css: "highlight",
  inWord: true,
  caseSensitive: false,
});

Word & Character Highlighter In jQuery, TUS.Marker Plugin/Github, highlight using jquery, how to search text in html page using jquery


See Demo And Download

Official Website(uekichinos): Click Here

This superior jQuery/javascript plugin is developed by uekichinos. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *