Re: [css3-gcpm] Re: conditional floats on paged media

I like the idea of being able to declaratively alter my references to 
figures and sections based on where they end up.

Håkon Wium Lie:
> But it's stretching the declarative model. JavaScript seems to offer
> the required escape hatch for these cases. Or, how would you spec this
> output in CSS:
>
>    The figure is on this page.
>    The figure is on the next page.
>    The figure is on the previous page.
>    The figure is on page 6.
>
>>From this HTML code:
>
>    The figure is <a href=#figure>here</a>.

.figure {
   float: snap;
}

a:target-matches(attr(href, url), .figure)
  :target-counter(attr(href, url), page, same) {
   content: "on this page";
}

a:target-matches(attr(href, url), .figure)
  :target-counter(attr(href, url), page, next) {
   content: "on next page";
}

a:target-matches(attr(href, url), .figure)
  :target-counter(attr(href, url), page, previous) {
   content: "on previous page";
}

a:target-matches(attr(href, url), .figure) {
   content: "on page " target-counter(attr(href, url), page);
}


Being able to tell whether the figure was floated in the end or not 
would also be useful.

a:target-matches(attr(href, url), .figure:not(:floating)) {
   content: "below";
}

That does invite you to wonder what

   :floating { float: none; }

and

   a:target-counter(attr(href, url), page, same) {
     counter-reset: page;
   }

might mean, though.

Received on Thursday, 16 August 2012 22:43:22 UTC