CODEWITHSUNDEEP
htmlcsscss-transitions
novicePrgrmr
novicePrgrmr

Reputation: 19395

How to use CSS3 to resize table rows

I have this jsfiddle that hides tables rows.

I am trying to get it to expand the row to height=200 instead of hiding it.

Feel free to suggest an easier method of doing it (html5, etc) as well.

Upvotes: 3

Views: 561

Answers (1)

babca
babca

Reputation: 786

You can use jQuery toggle() with two functions as parameters. Documentation. It allows you to define two or more functions to cycle through on each mouse click.

$(document).ready(function()
{
//slide up and down when click over id #one
$("#one").toggle(
    function()
        {
        $(".togglebox").height(200);
        },
    function()
        {
        $(".togglebox").height(100);
        });
});

Working demo: http://jsfiddle.net/RNvP4/

Upvotes: 2

Related Questions