I was sitting in class and wanted to come up with some simple way to add a inline same page ajax search on a website. I came across the jQuery selector :contains(text), check out the documentation for this. Now the to the final product, lets check out the demo. We are going to have our main components for this:
- The form (1 input and submit)
- The :contains selector
- The fadeIn() effect
- The addClass()
The approach for the code is going to be like
- User will enter term in form
- Save data to a variable
- Place variable in to :contains selector
- Fade in the highlight class (using fadeIn() and addClass())