Markers

Markers

css2pdf @cloudformatter

Xportability

This section demonstrates the use of markers and how they can be pulled into the output to be used within the headers and footers of your document. First, what is a marker? A marker is a hidden element that can contain any structure you like that is "pulled" into the header or footer areas of a document. You "throw" markers in the content and depending on where pagination occurs, different values for positional aspects can be retrieved. Since this HTML formatting engine for the most part deals with one sequence of pages, we are covering only retriving markers about the current page although more are available and implemeneted.

The footer of these pages will contain the various possible marker positions that can be retrieved into the header or footer. Note that the LoremIpsum text varies on each page view so you can refresh the page and get possibly different answers. As for positions, you can retrieve markers using:

• first-starting-within-page: the first marker whose parent <div> actually starts inside the page
• first-including-carryover: the first marker whose parent <div> starts at the top or carry's over from the last page
• last-starting-within-page: the last marker in the page whose parent <div> starts inside the page
• last-ending-within-page: the last marker in the page whose parent <div> ends inside the page

The code for this in the HTML looks like this:

    <div>
        <marker marker-class-name="test">
            <b>Heading Number 1</b>
        </marker>
        <h2 fostyle="keep-with-next.within-page: always;">Heading Number 1</h2>
        <!-- content here -->
    </div>
            

And the code in the footer region looks like this:

    <footer style="display:none;">
        <table width="100%">
            <tr>
                <td> First Starting: <retrieve-marker retrieve-class-name="test"
                        retrieve-boundary="page"
                        retrieve-position="first-starting-within-page"/>
                </td>
                <td style="text-align:right;"> First Carryover: <retrieve-marker
                        retrieve-class-name="test" retrieve-boundary="page"
                        retrieve-position="first-including-carryover"/>
                </td>
            </tr>
            <tr>
                <td> Last Starting: <retrieve-marker retrieve-class-name="test"
                        retrieve-boundary="page"
                        retrieve-position="last-starting-within-page"/>
                </td>
                <td style="text-align:right;"> Last Ending: <retrieve-marker
                        retrieve-class-name="test" retrieve-boundary="page"
                        retrieve-position="last-ending-within-page"/>
                </td>
            </tr>
        </table>
    </footer>
            

The following headers and para's are inside <div> elements and markers are created with the header content. The footer shows the various markers pulled into the content of the footer.