Question

我有一个问题是有什么方法可以在jquery中包装特定的高度内容以下是我的要求我希望有人能帮我解决这个问题

  <p>Ligula mi volutpat porta consectetur in varius quisque at mus dignissim in felis felis ultricies ullamcorper ornare per vestibulum diam nibh id. A ridiculus scelerisque felis id eget dictumst a parturient amet blandit suspendisse vulputate vitae ullamcorper nullam ante eu sit fermentum vivamus nisi ridiculus lobortis.<p>

如果这个内容达到特定的高度，覆盖高度的内容应该在一个组中，并且多余的内容应该包含在另一个div组中是否可能？

Answer 1

这是我的问题的答案

<强> HTML

          <div class="record">some element
        <br/>content</div>
      <div class="record">some element
        <br/>contentsome element
        <br/>contentsome element
        <br/>content</div>
      <div class="record">some element
        <br/>content</div>
      <div class="record">some element
        <br/>contentsome element
        <br/>contentsome element
        <br/>contentsome element
        <br/>contentsome element
        <br/>content</div>
      <div class="record">some element
        <br/>contentsome element
        <br/>content</div>
      <div class="record">some element
        <br/>contentsome element
        <br/>content</div>
      <div class="record">some element
        <br/>contentsome element
        <br/>content</div>
      <div class="record">some element
        <br/>contentsome element
        <br/>content</div>

在你的功能

中

        var $records = $('.record'),
      total = 0,
      group = 0,
      limit = 200; //px

    $records.each(function() {
      var $record = $(this);
      total += $record.outerHeight(true);

      if (total > limit) {
        total = $record.outerHeight(true);
        group++;
      }
      //$record.attr('data-height', $record.outerHeight(true));
      //$record.attr('data-total', total);
      $record.attr('data-group', group);
    });

    for (var i = 0; i <= group; i++) {
      $('[data-group="' + i + '"]').wrapAll('<div class="page"></div>')
    }

如何将所有内容包装在特定高度？

1 个答案: