Text Highlighting and Filtering Plugin with jQuery

An useful jQuery Plugin that allows your visiters to highlight and filter text by the keywords they need.  When someone types anything in the input text field then a set area on your page becomes responsive and only displays part of that area which contains the word or string typed by the user.

How to use it:

1. Include jQuery library and jcfilter.min.js before tag

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jcfilter.min.js"></script>

Include jQuery library and jcfilter.min.js before tag

<h3>Filter by keyword
<input type="text" id="filter" style="background:url(img/filter.png) 95% 60% no-repeat;background-size:16px; width:150px">
</h3>

<div class="jcorgFilterTextParent" style="display: block;">
<h3>This is header 1</h3>
<div class="jcorgFilterTextChild">...</div>
</div>

<div class="jcorgFilterTextParent" style="display: none;">
<h3>...</h3>
<div class="jcorgFilterTextChild">...</div>
</div>

...

3. Call the function with options

<script type="text/javascript">
jQuery(document).ready(function(){
   jQuery("#filter").jcOnPageFilter({animateHideNShow: true,
      focusOnLoad:true,
      highlightColor:'yellow',
      textColorForHighlights:'#000000',
      caseSensitive:false,
      hideNegatives:true,
      parentLookupClass:'jcorgFilterTextParent',
      childBlockClass:'jcorgFilterTextChild'});
});   
</script> 

---

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