https://github.com/bredele/jquery-filter
Filter your document and create client-side search engine
https://github.com/bredele/jquery-filter
Last synced: over 1 year ago
JSON representation
Filter your document and create client-side search engine
- Host: GitHub
- URL: https://github.com/bredele/jquery-filter
- Owner: bredele
- Created: 2013-10-16T16:44:36.000Z (almost 13 years ago)
- Default Branch: master
- Last Pushed: 2013-12-31T01:46:46.000Z (over 12 years ago)
- Last Synced: 2025-02-12T09:49:57.175Z (over 1 year ago)
- Language: JavaScript
- Size: 109 KB
- Stars: 3
- Watchers: 5
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
- Changelog: History.md
Awesome Lists containing this project
README
# jquery-filter
CSS engine to filter your dom inspired by this [article](http://redotheweb.com/2013/05/15/client-side-full-text-search-in-css.html)
## Usage
First, include the jQuery and the filter plugin:
```html
```
Then create your filter as following:
```html
Olivier is in Calgary
Bruno is in Paris
Amy is in Lethbridge
```
> don't forget to add the class filter-item on any searchable element and to add the tags into a the data-filter attribute
and intialize your plugin:
```js
var filter = $('.filter').filter();
```
## API
### run(value [,className])
Perform filtering. `className` is optional
```js
stack.run('olivier');
```
## Events
### filter
```js
$('.filter').trigger('filter', 'olivier');
```
## Options
### Namespace
Change the data attribute name (default is filter).
```js
var filter = $('.filter').filter({
namespace:'obama'
});
```
## Todo
- create tags
- make it work on ie8
## Component
You can install a component version with [component(1)](http://component.io):
$ component install bredele/search
## License
MIT