Increase the height of the unit based on parent unit + assigned value



  • There's a code like this:

    <div class="row row_cont">
            <div class="col-sm-3 sidebar">
                <div class="side_mnu">боковое меню</div>
            </div>
            <div class="col-sm-9 cont">
                <div class="menu_top">
                        меню
                </div>
                <div class="posts">
                    посты
                </div>
            </div>
    </div>
    

    The bump grid, block ...sidebar is used to use negative margin-top=168px, so that the scrupt takes the height of the block.row_cont and returns its sidebar block to 168. Found a scream that returns the height of all the savages based on the height of the parent diva. But somehow finishing it to add value to the block...sidebar, I'm not allowed to have no knowledge in the yavascripte.

    function setEqualHeight(columns)
    {
        var tallestcolumn = 0;
        columns.each(
            function()
            {
                currentHeight = $(this).height();
                if(currentHeight > tallestcolumn)
                {
                    tallestcolumn = currentHeight;
                }
            }
            );
        columns.height(tallestcolumn);
    }
    $(document).ready(function() {
        setEqualHeight($(".row_cont > div"));
    });
    


  • jQuery(function($) {
      var wrapper = $('.row_cont'),
          sidebar = $('.sidebar', wrapper);
    

    sidebar.height(wrapper.height() + 168);
    })

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="row row_cont">
    <div class="col-sm-3 sidebar">
    <div class="side_mnu">боковое меню</div>
    </div>
    <div class="col-sm-9 cont">
    <div class="menu_top">
    меню
    </div>
    <div class="posts">
    посты
    </div>
    </div>
    </div>




Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2