Resize element width on window resize jquery

Benn picture Benn · Jun 11, 2012 · Viewed 16.8k times · Source

I am computing elements width on page load with jq and works fine , trying to automate on window resize but kinda does not work. Desired effect: Boxes should auto resize on window resize and not drop down.

http://jsfiddle.net/yMcXm/4/

any help is appreciated . Thank you!

Answer

Selvakumar Arumugam picture Selvakumar Arumugam · Jun 11, 2012

Try $(window).resize See below,

$(document).ready(function() {
    var cw = $('#container').width();
    $(".box").width(cw / 5);

    $(window).resize(function() {
        var cw = $('#container').width();
        $(".box").width(cw / 5);
    });
});

Also used overflow property on the container and box_in, so that the elements/text inside are contained/hidden.. instead of going out.

DEMO: http://jsfiddle.net/skram/yMcXm/7/