如何在页面加载后根据不同的元素高度设置angularjs中的样式?

时间:2015-08-05 10:30:41

标签: javascript css angularjs

我有一个标题元素,其动态高度仅初始化一次。 现在我想在具有屏幕高度的角应用程序的可滚动视图中设置一个元素,比如foo,减去标题高度。因此它们非常适合屏幕。 在高度为100vh的元素下方 - 动态大小,是更多的元素。

我读过一个人可以使用这样的东西:

var myHeight = angular.element(document.querySelector('#header'))[0].offsetHeight

然后说在动态内联样式中使用它,例如

<foo style="height: calc(100vh - {{myHeight}})">

注意:calc是一个CSS函数。

但我在哪里使用它?何时加载我的应用以获得正确的高度?

1 个答案:

答案 0 :(得分:1)

试试这个

function drop_show(a) {
    var s = '#'+a + " ul.dropdown";
    $(s).css('clip', 'auto');
}

function drop_hide(a) {
    var s = '#'+a + " ul.dropdown";
    $(s).css('clip', 'rect(1px, 1px, 1px, 1px)')
}
var drop_a = $('.has-dropdown');
drop_a.each(function() {
    $(this).attr("onMouseOver", "drop_show('" + $(this).attr('id') + "');");
    $(this).attr("onMouseout", "drop_hide('" + $(this).attr('id') + "');");
})

还有更多方法可以查看更多信息this