ID:COUs1./vfnSl さんの質問

40,477 views

position:absoluteすると、親BOXから高さが無くなってしまいますが、絶対指定した位置を親要素に残す方法 or 高さをjQueryなどで取得する方法はありますでしょうか?

登録日:2013-02-04 · カテゴリー:一般

みんなの回答 4 件

2013-02-04 · ID:88fdNcQmS/Xn 報告

javascriptで高さを取得して親boxに指定してあげればいい

2013-02-05 · ID:DYVB923uz70L

ありがとうございます。消えてしまった高さを取得する具体的な方法が検討がつかず、教えていただけるとありがたいのですが・・。

2013-02-05 · ID:wrb3vdRZKXcs 報告

$.height()を知らないんだったら、jQuery使わない方がいい。というか、まず調べろ。

jQuery API Documentation

http://api.jquery.com/
2013-02-05 · ID:DYVB923uz70L

$(’.parent’).height();としてもやっぱり0としか取得できないのですが、どうすればいいのでしょうか・・・。

2013-02-05 · ID:kq8z8C88qEG1

基礎を勉強しよー。
勉強してる上でならわかるけどこれはちょっと…。
ググればすぐでてくるしね…。

2013-02-05 · ID:kq8z8C88qEG1

まずは苦労して取得しないでもCSSだけでほんとにできないのか試行錯誤したほうが勉強になるとおもいます。これだけしか情報がないとほんとに高さを取得する必要があるのかどうかも判断できないです。

2013-02-05 · ID:DYVB923uz70L

"position absolute 高さ 消える"とか"jquery .height() position absolute"などでググって見たのですが、出てきません・・・。

情報が少なくて、申し訳ありません。
レスポンシブWEBデザインとはちょっと違うと思うのですが、PCとスマホでhtmlを共有して、レイアウトをデバイスごとに振り分けたいのです。
スマホはそのまま縦に並べれば良いのですが、PCの場合は、absoluteで絶対指定してレイアウトにこだわりたい、という意図です。

2013-02-05 · ID:MkEOFF3YFb0q

その場しのぎではなく、基本からしっかり勉強して下さい

2013-02-05 · ID:DYVB923uz70L

厳しいご意見ありがとうございます。
すぐに質問すれば解決すると甘い気持ちでいたのは事実だと思います。
基本から勉強するのはもちろん大切だと思います、気持ちを改めてこれから時間をかけて0からもう一度勉強したいと思います。

ですが、今困っている事に対して、できればご助言をいただけると非常に助かるのですが・・・。

2013-02-05 · ID:xZslFPix1E0P

自社のプログラマーに聞けよ!

2013-02-05 · ID:DYVB923uz70L

身近に聞ける人がいればそうするのがベストなのはおっしゃるとおりですが、残念ながら居ないので、こちらで相談させていただいています。

2013-02-05 · ID:wrb3vdRZKXcs

var h=$("#child").height();
$("#parent").height(h);
頭使っていこー

2013-02-05 · ID:pHqfxYnz0HSq 報告

position:absolute使うなら、親要素にheightを付ければいいんでは?

2013-02-05 · ID:DYVB923uz70L

heightを付ければ解決するのは分かっていますが、コンテンツによって長さが可変なので、固定のheightは付けられません。

2013-02-06 · ID:9ro3EyX81x.y

じゃあ、min-heightでいいじゃんって思うんだけど。

2013-02-05 · ID:LTklLEyqftOn 報告

基本はこんな感じじゃないですかね。いきなりparentから取ろうとしても、高さ出てないんだから取れません。実際に内容の書いてあるchildrenから高さを取って、その値をparentに指定します。

<div class="parent"> 
<div class="children" style="position:absolute;"> 
本文 
</div> 
</div> 
--- 
$(function(){ 
  var h = $('.children').height(); 
  $('.parent').height(h); 
  alert(h);//高さ確認用アラート 
});
2013-02-05 · ID:DYVB923uz70L

具体的なコードのご指摘、ありがとうございます。
子要素が複数あってそれぞれheightや配置がまちまちな場合は、.height()と.top()を足した子要素を比較して、一番長いものをparentに代入するという感じでしょうか?

もうすこしスマートな方法があれば、と思ったのですが、この方法が一番無難ですかね?
ありがとうございます。

2013-02-05 · ID:HCvOQVL9rUiv

スマートな方法はあるかもしれないけど、トピ主がどんなものを作りたいのかいまいちわからないからID:LTklLEyqftOnとかID:pHqfxYnz0HSqのような答え方しかできないよ。

回答の受付は終了しました。

関連トピック