Scenario
You are making a website that include a table in the main section. This table is quite lengthy and you want your users to still be aware of the other sections of the page such as the news column rather than scrolling down to look at the table and losing the top half of the page.
Solution
You decide to implement a jQuery plugin that allows scrolling of the table in a set area so your reader does not need to leave the rest of the page to read more of the table. You also decide to make the columns sortable and to have the row highlighted that the mouse is currently over.
The goal here is to make a functional and nice looking table that will not take away from the rest of the page.
jQuery Plugins
| L. Name | F. Name | Web Site | |
|---|---|---|---|
| Smith | John | jsmith@gmail.com | http://www.jsmith.com |
| Smith | Jane | jsmith@gmail.com | http://www.jsmith.com |
| John | Smith | smithj@gmail.com | http://www.smithj.com |
| Jane | Smith | smithj@gmail.com | http://www.smithj.com |
| Magilicuty | Fred | fmagilicuty@gmail.com | http://www.fmagilicuty.com |
| Tyler | James | jtyler@gmail.com | http://www.jtyler.com |
| Cleaverton | Bob | bcleaverton@gmail.com | http://www.bcleaverton.com |
| Bob | Billy | bbob@gmail.com | http://www.bbob.com |
| Kirk | Captain | ckirk@gmail.com | http://www.ckirk.com |
| Jefferson | Jeff | jjefferson@gmail.com | http://www.jjefferson.com |
| Zanders | Zoe | zzanders@gmail.com | http://www.zzanders.com |
| Flanders | Ned | nflanders@gmail.com | http://www.nflanders.com |
| Jetson | George | gjetson@gmail.com | http://www.gjetson.com |
| Bloodhoof | Cairne | cbloodhoof@gmail.com | http://www.cbloodhoof.com |
| Proudmoore | Jaina | jproudmoore@gmail.com | http://www.jproudmoore.com |
| Sinatra | Frank | fsinatra@gmail.com | http://www.fsinatra.com |
| Smith | John | jsmith@gmail.com | http://www.jsmith.com |
| Smith | Jane | jsmith@gmail.com | http://www.jsmith.com |
| John | Smith | smithj@gmail.com | http://www.smithj.com |
| Jane | Smith | smithj@gmail.com | http://www.smithj.com |
| Magilicuty | Fred | fmagilicuty@gmail.com | http://www.fmagilicuty.com |
| Tyler | James | jtyler@gmail.com | http://www.jtyler.com |
| Cleaverton | Bob | bcleaverton@gmail.com | http://www.bcleaverton.com |
| Bob | Billy | bbob@gmail.com | http://www.bbob.com |
| Kirk | Captain | ckirk@gmail.com | http://www.ckirk.com |
| Jefferson | Jeff | jjefferson@gmail.com | http://www.jjefferson.com |
| Zanders | Zoe | zzanders@gmail.com | http://www.zzanders.com |
| Flanders | Ned | nflanders@gmail.com | http://www.nflanders.com |
| Jetson | George | gjetson@gmail.com | http://www.gjetson.com |
| Bloodhoof | Cairne | cbloodhoof@gmail.com | http://www.cbloodhoof.com |
| Proudmoore | Jaina | jproudmoore@gmail.com | http://www.jproudmoore.com |
| Sinatra | Frank | fsinatra@gmail.com | http://www.fsinatra.com |
| Smith | John | jsmith@gmail.com | http://www.jsmith.com |
| Smith | Jane | jsmith@gmail.com | http://www.jsmith.com |
| John | Smith | smithj@gmail.com | http://www.smithj.com |
| Jane | Smith | smithj@gmail.com | http://www.smithj.com |
| Magilicuty | Fred | fmagilicuty@gmail.com | http://www.fmagilicuty.com |
| Tyler | James | jtyler@gmail.com | http://www.jtyler.com |
| Cleaverton | Bob | bcleaverton@gmail.com | http://www.bcleaverton.com |
| Bob | Billy | bbob@gmail.com | http://www.bbob.com |
| Kirk | Captain | ckirk@gmail.com | http://www.ckirk.com |
| Jefferson | Jeff | jjefferson@gmail.com | http://www.jjefferson.com |
| Zanders | Zoe | zzanders@gmail.com | http://www.zzanders.com |
| Flanders | Ned | nflanders@gmail.com | http://www.nflanders.com |
| Jetson | George | gjetson@gmail.com | http://www.gjetson.com |
| Bloodhoof | Cairne | cbloodhoof@gmail.com | http://www.cbloodhoof.com |
| Proudmoore | Jaina | jproudmoore@gmail.com | http://www.jproudmoore.com |
| Sinatra | Frank | fsinatra@gmail.com | http://www.fsinatra.com |