Print page numbers for table of contents using CSS in Chrome

Question

Is there a way to print target page numbers with hyperlinks which linked to various places within the same document?

<h1>Table of Contents</h1>
<ul>
    <li><a href="#introduction">Introduction</a></li>
</ul>

...

<section id="introduction"> <!-- Appears, for example, on page 3 when printed -->
    <h1>Introduction</h1>
    ...
</section>

So that the output is like:

Table of Contents (page 0)

Introduction.........................3


...


Introduction (page 3)

I only need this to work with the Google Chrome browser when printing to PDF (on OS X).

Is there some CSS or JavaScript trickery which would allow me to achieve this?

Answer 1

It looks like this is part of a new working draft of the CSS specification:

http://www.w3.org/TR/2014/WD-css-gcpm-3-20140513/#cross-references

I doubt that there is any browser support yet...