Home

Holmes.js

Fast and easy searching inside a page.

Build Statusnpm version

Installation

$ npm install --save holmes.js

After which you can add it in your page with i.e. browserify or loading the module in a different script tag.

You have to make sure that you have a css rule for the class .hidden that hides elements however you want. One option is to have this:

.hidden {
  display: none;
}

but this could be any css you want.

Usage

demo

holmes({
  input: '.search input', // queryselector for the input
  find: '.results article', // queryselector for element to search in
  placeholder: 'no results', // (optional) text to show when no results
  class: {
    visible: 'visible', // (optional) class to add to matched elements
    hidden: 'hidden' // (optional) class to add to non-matched elements
  }
});

full documentation

Questions?

Compatible up to IE9.

Let me know on twitter: @haroenv.

License

Apache 2.0