jqueryで高さ取得.outerHeight(true)の［n］px+40%=取得したい値

Question

解決したいことは、コンテンツの高さを取得し、その値に40%を足した値を指定のdivのheightへ与えたいのですが、
正しい値にならず、*1.4の記述方法の他に分かる方がいましたら、ご教授いただけますでしょうか。

$(window).on('load resize', function(){
var H = $('.site-content').outerHeight(true)*1.4;
var F = $('#footer-title').outerHeight(true);
var HE = $('#header-title').outerHeight(true);
  $('.spacer').css('height', H + F + HE + 'px' );
});

Answer 1

加算したい40%とはスクロールした際に#contentに設定されるtop:40%の値でしょうか？
その場合この40%はコンテンツの高さではなくブラウザの高さなので$(window).height()*0.4を使用してみてください。

Comments

[退会済みユーザー]

ご回答ありがとうございます。
#contentのtop:40%です。
ただこの40%は、triggerの位置へ到着するとfixedからabsoluteに切り替え後の位置を調整するためのものになります。

$(window).height()*0.4を試したところ、.spacerの高さがウィンドウの高さになってしまい、
コンテンツの高さ分までスクロールが出来なくなってしまいました。

ご確認いただけますでしょうか。

[退会済みユーザー]

$(window).height()*0.4を試した際に質問文にあるコード全体をどう変更したのか教えていただけますか

Answer 2

少数計算の問題ならこちらに類似のものが→ https://teratail.com/questions/34414

var H = $('.site-content').outerHeight(true)*1.4;
var F = $('#footer-title').outerHeight(true);
var HE = $('#header-title').outerHeight(true);
// 小数点以下の最大桁数を取得
var x = (''+H).replace(/^[^\.]+\./g, '').length;
var y = (''+F).replace(/^[^\.]+\./g, '').length
x = (x < y) ? y : x;
var y = (''+HE).replace(/^[^\.]+\./g, '').length;
x = (x < y) ? y : x;
// 整数化して計算
H = Math.round(H * Math.pow(10, x));
F = Math.round(F * Math.pow(10, x));
HE = Math.round(HE * Math.pow(10, x));
var height = (H+F+HE) / Math.pow(10, x);
$('.spacer').css('height', height + 'px' );

Comments

[退会済みユーザー]

ご回答いただきありがとうございます。
今回の質問内容ですが、少数計算の問題ではなく
40%の加算をすることなのですが、コンテンツの高さを取得することが一つと、position:fixedで位置を40%分下げているため、その40%を取得し加算されていないと、ページ下部に移動した際に、大きな空白が出来てしまうのを防ぎたいです。