asked on

Jquery css width - how to remember width setting

Hi,
I have a table which contains several rows, and 5 columns made up from DIVS - basically, when a column is clicked it gets expanded via a Jquery expand CSS width routine, like this:

$(document).ready(function() { 
$('#expand3').click(function () { 

switch($('#followupexp').css('width') )

{ 

case '144px': 

        $('#followupexp').css('width','720px');
        $('#followupexp1').css('width','720px');
        $('#followupexp2').css('width','720px');
        $('#followupexp3').css('width','720px');
        $('#followupexp4').css('width','720px');
        $('#followupexp5').css('width','720px');
        $('#followupexp6').css('width','720px');
        $('#followupexp7').css('width','720px');
        $('#followupexp8').css('width','720px');
        $('#followupexp9').css('width','720px');
        $('#followupexp10').css('width','720px');

Open in new window

When clicked the column gets shrunk back up using this:

case '720px':

        $('#followupexp').css('width','144px');
        $('#followupexp1').css('width','144px');
        $('#followupexp2').css('width','144px');
        $('#followupexp3').css('width','144px');
        $('#followupexp4').css('width','144px');
        $('#followupexp5').css('width','144px');
        $('#followupexp6').css('width','144px');
        $('#followupexp7').css('width','144px');
        $('#followupexp8').css('width','144px');
        $('#followupexp9').css('width','144px');
        $('#followupexp10').css('width','144px');

Open in new window

This works great, but if the user goes to page 2, 3, 4 etc. with the pagination, then the setting i.e. expanded column doesn't stay expanded. Is it possible to get it to remain open until shrunk manually?

Thanks

ASKER CERTIFIED SOLUTION

Ray Paseur

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

damianb123

ASKER

Thanks Ray, it might make more sense if you see the test page. If you look here:

http://www.comparedrs.com/gpw-results.php

This is an inherited piece. Clicking on any of the columns will display the full width for that category, but navigating through the various pages reverts it back to a minimised width. I'm trying to get it so the full width remains open when a new page is selected....

Thanks for the Bootstrap info, I shall have a look at that for any future projects.

Scott Fell

It would help to see a link to your site as well. If the data is private, just make up some sample data.