Search This Blog

26 May 2011

Creating a scrollable table with fixed row and column

To create a Scrollable Table you will need to download JQuery library and jquery.fixer plugging from http://plugins.jquery.com/project/fixer

On this page when you click on download link, a zipped folder will get downloaded. Unzip that folder and then copy "jquery.js" and "jquery.fixer.js" files into the folder where your webpage exist.

To create a scrollable table into your webpage, all you need to do is include "jquery.js" and "jquery.fixer.js" files in your webpage and then on document.ready event, for the table on which you want to enable scrolling call fixer function from "jquery.fixer.js" file. For more detail, see the demo code given below.


7 comments:

  1. Hello

    I would like to use this solution on Blogger.

    Except of course I cannot host the jquery library or plugin on Blogger. Do you have any suggestions how I would proceed?

    ReplyDelete
  2. Adding jQuery library to your Blogger blog is not difficult. For that you have to add one line of code to your template’s header.

    Please go through below given steps,
    1 - Login to your blog.
    2 - From the top menu select "Layout".
    3 - Then select "Edit HTML"
    4 - Add following code just below head tag
    < script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript" > < /script >

    For adding JQuery plugin their are 2 way
    1 - You can paste the plugin code in your HTML (not a good idea)
    2 - You can host this plugin, if you have a domian, or you can use google site for hosting this plugin. Then add following line
    < script src="your host .../fixer.js" type="text/javascript" > </script >

    Hope this could be helpful to you...

    ReplyDelete
  3. Thanks! Just what I needed. With jQuery life will not be the same ever again!

    ReplyDelete
  4. Very nice but would have been nice to be able to cut-paste the code...

    ReplyDelete
  5. Thank you - a brilliant solution that worked first time...the amount of time I have spent trying to do this cannot be measured.

    ReplyDelete
  6. Is there any way to do this and not have it applied to a sub table?

    ReplyDelete