4

相対位置のdiv内に絶対位置のdivがあります。

親の相対divのサイズを、絶対divのサイズに変更する必要があります（これは、どのページにあるかによって動的に変化します）

これはjqueryを使用して実行できることを読みましたが、機能させることができません。

これが私が持っているものです...

HTML

 <div class="product-view">
<div style="float:left;">Product Image</div>
 <div class="product-shop">
<div id="mm_grid_wrapper">
<table>dynamic content</table>
</div>

CSS .. ..

    .product-view {
    margin-top: 5px;
    border: 1px solid #cecece;
    padding: 22px 0 0 0;
    position: relative;
    bottom:0px;


}
.product-view .product-shop {
    text-align: left;
    width: 48%;
    float: left;/*max-width: 329px;*/
}

    #mm_grid_wrapper{
position:absolute;
left:10px;
margin:0 310px 0 0;
max-width: 1630px;
top:0;
height:100%;
}


}

javascript..。

$(function()
{
    $('.product-view') .css({'height': (($('#mm_grid_wrapper').height()) + 20)+'px'});

    $('#mm_grid_wrapper').bind('resize', function(){
        $('.product-view') .css({'height': (($('#mm_grid_wrapper').height()) +20)+'px'});
             });
});
4

1 に答える 1

0

  1. 「bottom:0px;」を削除します。css の product-view クラスから削除すると、html が台無しになります。

  2. jquerycode を DOM 対応リスナーに配置してみてください。

     $(document).ready(function(){
    $('.product-view') .css({'height': (($('#mm_grid_wrapper').height()) + 20)+'px'});

    $('#mm_grid_wrapper').bind('resize', function(){
      $('.product-view') .css({'height': (($('#mm_grid_wrapper').height()) +20)+'px'});
     });
 });

  3. jquery で "resize()" と "height()" 関数を使用すると、最終的なコードは次のようになります。

         $(document).ready(function(){
    $('.product-view').height($('#mm_grid_wrapper').height() + 20);

    $('#mm_grid_wrapper').resize(function(){
      $('.product-view').height($('#mm_grid_wrapper').height() + 20);
     });
 });
于 2013-03-05T15:35:52.097 に答える