Question

i have implemented this script on a site for the scrollTo plugin, but i don’t really understand javascript/jquery enough to edit everything i need. the way this is written, it sets a 100% height so content gets cut off. i know enough to see i need to change a definition/variable here, but don’t know what i would be replacing it with. min-height? can i put a fixed number in there? i would like to write to the min-height css property if at all possible.

function resizePanel() {

    width = $(window).width();
    height = $(window).height();

    mask_width = width * $('.item').length;

    $('#debug').html(width  + ' ' + height + ' ' + mask_width);

    $('#wrapper, .item').css({width: width, height: height});
    $('#mask').css({width: mask_width, height: height});
    $('#wrapper').scrollTo($('a.selected').attr('href'), 0);

}

thanks in advance. i tried searching for syntax questions on google but i doubt i’m searching for the right terms as i came up with zilch.

Answer 1

You can use .css() to set the min-height property like this:

$('#mask').css({width: mask_width, "min-height": height});

I think minHeight: would also work; jQuery recognizes both CSS-style and DOM-style spellings.

That said, it might be better to leave JavaScript alone and tweak the appearance using CSS. Maybe you can just put a CSS rule like #mask { min-height: 100%; } in your stylesheet.