title: pretty print using jquery
body: <p>I want to implement pretty print using jquery and html. if any div with .section class is in bottom of A4 page (my A4 body width is 595px and each page height is 842px) i add margin for push this section in next page. here is my code:</p>
  <pre><code>  $(&quot;.section&quot;).each(function () {
      //add element offset top to detect element page number
      //for example if element top is 1400 then it is in page 2 (842*2 &gt; 1400)
      $(this).attr('data-top', $(this).offset().top);
  });
  $(&quot;.section&quot;).each(function () {
          $elementTop = $(this).data('top');
          if (parseInt($elementTop) &gt; ($currentPage * $A4PageHeight)) {
                  if (!$(this).hasClass('rendered')) {
                      $(this).css('margin-top', ($elementTop - ($currentPage * $A4PageHeight)) + 'px');
                      $(this).addClass('rendered');
                      $(this).addClass('page-'+$currentPage);
              }
              $currentPage += 1;
          }
      });
  </code></pre>
  <p><a href="https://i.stack.imgur.com/MV2EB.jpg" rel="nofollow noreferrer">enter image description here</a></p>