jQuery Plugin To Highlight #HashTags In Text Fields - goslowTag

File Size: 4.8 KB
Views Total: 2300
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Highlight #HashTags In Text Fields - goslowTag

goslowTag is a lightweight jQuery plugin to highlight hashtags inside your text fields (input fields and textareas) by wrapping the #hashtag in the span element.

How to use it:

1. Add jQuery library and the jQuery goslowTag plugin's source files into the webpage.

<link rel="stylesheet" href="css/goslowTag.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="js/goslowTag.js"></script>

2. Just call the plugin on the text field and we're done.

$('input,textarea').goslowTag();

3. All the strings with the '#' prefix will be wrapped in the <span class="hashtag">#hashtag</span> element so that you can style them in the CSS whatever you like. Note that make sure the font-size matches your input field or textarea font-size.

.goslowTag .hashtag{
  font-weight: 500;
  color: black;
  white-space: pre-wrap;
}

This awesome jQuery plugin is developed by Oluwatemilorun. For more Advanced Usages, please check the demo page or visit the official website.