动态更新浏览器窗口的高度

时间:2013-05-21 21:08:57

标签: javascript jquery

我有一个页面: - default.aspx。

我可以通过css改变它的高度: -

.main
{
    padding: 0px 12px;
    margin: 12px 8px 8px 8px;
    min-height: 420px;
    width: 919px;
    height: 850px;
}

只需增加适当参数的高度或减少。

但我正在尝试实现一个javascript功能,只需点击一个按钮即可启动某个功能(onclienclick)。现在使用此功能,页面上添加了添加的元素,因此我希望页面大小也增加。然后再次点击同一个按钮,元素消失,所以我希望页面高度减少。我想的代码类似于以下(但显然我的语法不正确)。任何人都可以帮忙吗?

$('main').css(‘height’) = 1186px; ????

3 个答案:

答案 0 :(得分:5)

轻松自负。

$('.main').css('height',1186);

它需要包含在括号内。此外,jQuery假设数字是px,因此您不需要显式调用px。如果您想要花哨,可以使用原生DOM名称:

$('.main').css({height:1186});

没有区别,只是未来参考如果您想要多个声明,您可以一次完成所有这些:

$('.main').css({
    height:1186,
    width:800,
    backgroundColor:'red',
    lineHeight:25,
    color:'blue',
    boxShadow:'0 0 10px rgb(0,0,0)'
});

你可以做一些疯狂的事情!

答案 1 :(得分:2)

因为你正在使用jQuery:

$('.main').height(1186);

参考:http://api.jquery.com/height/#height2

答案 2 :(得分:1)

你忘记了类名,值就在函数内部。你的引号也是混合的。完整点击功能看起来像这样。

$("a.classname").click(function(){
    $(".main").css({ "height" : "1186px" });
});