CODEWITHSUNDEEP
jqueryhtmlresizehtml-table
venkatachalam
venkatachalam

Reputation: 102439

Resizing the HTML table width in jQuery

I need to vary a table's width after a click event in jQuery.

HTML:

<table class="zebra" border=0>

Case 1:

$("table.zebra").css("width","600px");

Case 2:

$("table.zebra").css("width","200px");

CSS:

table.zebra{}
table.zebra tr.even td, table.zebra tr.even th { background-color:#FDD017; }
table.zebra tr.odd td { background-color:#FFF380; }

This does not change the table's width like I want.

What am I doing wrong?

Upvotes: 11

Views: 57999

Answers (4)

shadab momin
shadab momin

Reputation: 139

This worked for me

    $('#MyModalID').find('.modal-dialog').css({
                width: '800px'
            });

Upvotes: 0

Paul Hachmang
Paul Hachmang

Reputation: 51

This should do the trick

$("table.zebra").width('200px');

Upvotes: 5

Konstantin Tarkus
Konstantin Tarkus

Reputation: 38358

Try this:

$("table.zebra").width(200);

Reference: http://docs.jquery.com/CSS/width#val

Upvotes: 10

William Brendel
William Brendel

Reputation: 32189

This should do the trick.

<table class="zebra">
  <tr>
    <td>foo</td>
    <td>bar</td>
  </tr>
</table>

<script type="text/javascript">
  $(function() {
    $('table.zebra').attr('width', 500);
  });
</script>

Upvotes: 14

Related Questions