jquery - cssのみを使用してブラウザのビューポートのすぐ上に要素を配置する方法は?

Question

絶対位置の要素をブラウザー ウィンドウのすぐ外、つまりブラウザー ビューポートのすぐ上に配置したいと考えています。指定された要素の正確な高さを提供できないことに注意してください。

これはできますか？そうでない場合は、jQuery を使用しても問題ありません。

Answer 1

CSS:

#theElement {
    position: fixed;
    bottom: 100%;
}

jQuery:

var $el = $('#theElement');

$el.css({
    position: 'fixed',
    top: '-' + $el.outerHeight()
});

Answer 2

要素がbodyレベルにある場合、これは機能するはずです:

#element {
  position: absolute;
  top: -100%;
}