相対配置された祖先から絶対配置された要素を外しますか？

は私が相対配置された祖先から絶対配置された要素を外しますか？

<style type="text/css"> 
div { 
    border:1px solid; 
    padding:15px; 
} 

#i_am_relatively_positioned{ 
    background-color:#fcc; 
    margin:50px; 
    padding:50px; 
    position:relative; 
} 

#inner { 
    background-color:#cfc; 
} 

#i_want_to_be_absolute_to_body{ 
    background-color:#ccf; 
    left:0; 
    position:absolute; 
    top:0; 
} 
</style> 

<body> 
    <div id="i_am_relatively_positioned"> 
    <div id="inner">inner</div> 
    <div id="i_want_to_be_absolute_to_body">absolute to body</div> 
    </div> 
</body>

のような文書ではなく、その直接の相対的なコンテナよりも、body要素に関して絶対配置#i_want_to_be_absolute_to_bodyを作るための方法がありますがあると？

私はちょうど否定的なトップと左を使用することができますが、それはkludgeyのようです - これは私の唯一のオプションですか？

出典

2011-02-01 jemminger

JavaScriptを使用してこれを行うことができます（マークアップを変更できないとしますか？）。

document.body.appendChild(document.getElementById('i_want_to_be_absolute_to_body'));

出典

2011-02-01 17:28:18 Sean

同じIDを持つ2つの要素が存在しないように、私はまた、古い要素を削除する必要があると思います= document.getElementById（ 'i_want_to_be_absolute_to_body'）; el.parentNode.removeChild（el）; document.body.appendChild（el）; – jemminger

いいえ、それは物事を壊します（IE8とChromeでテスト済み）。 appendChildを実行するだけで、ノードはDOM内で移動します。 SharePointと、クライアントが使用する別のCMSでこれを行う必要があります（通常、コンテナから別のコンテナに要素を移動しているのと同様の理由で）。 – Sean

それは "i_am_relatively_positioned" 要素 "i_want_to_be_absolute_to_bodyは" コンテナにあることを、重要なのですか？

この解決策ではない場合： VARエル：私が最も正しいと仮定

<div id="i_am_relatively_positioned"> 
    <div id="inner">inner</div> 
    </div> 
    <div id="i_want_to_be_absolute_to_body">absolute to body</div>

出典

2011-02-01 18:48:35 Chugworth

レンダリング時にドキュメントが構築されるため、この要素を別の場所に移動することは容易ではありません。 – jemminger

相対配置された祖先から絶対配置された要素を外しますか？

答えて

関連する問題