W3C home > Mailing lists > Public > www-style@w3.org > May 2012

Re: [CSSOM-view] Support centering an element when scrolling into view.

From: Thaddee Tyl <thaddee.tyl@gmail.com>
Date: Fri, 25 May 2012 22:12:40 -0700
Message-ID: <CAE3TfZOsNt=bvK7v=UQU3vn_4s9iUVESvg5Up8pE7jVLjA-toA@mail.gmail.com>
To: robert@ocallahan.org
Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, www-style@w3.org
In the process of specifying what I had in mind, I made the start of a polyfill.
It helped me identify another shortcoming of what I had done, namely having
a default `horizontal` property set to 0.0.

The code for the polyfill is available at
<http://jsbin.com/3/ilecok/5/edit?javascript>.

The WebIDL corresponding to this proposal is the following:

   partial interface Element {
     void scrollIntoView(ScrollPosition options);
   };

   dictionary ScrollPosition {
     float horizontal = 0.5;
     float vertical = 0.5;
     boolean evenIfViewed = false;
   };

This time, `horizontal` and `vertical` are meant as percentages of
the viewport width minus the offsetWidth of the element, and
the viewport height minus the offsetHeight of the element,
respectively.

This way, the element goes from having its top edge aligned with
the top edge of the viewport, to having its bottom edge aligned with
the bottom edge of the viewport, when changing `vertical` from 0 to 1.

Something else that I have uncovered from a reverse-engineering of
Webkit's scrollIntoViewIfNeeded <http://jsbin.com/oxaxuc/15/edit#javascript>
is the fact that partially visible elements are not positioned according to
the method's boolean flag.

Instead, the page is scrolled just enough so that the user both sees the element
completely, ensuring that we keep the context we were in.
I have included that in since it is more user-friendly.

On Wed, May 23, 2012 at 9:22 PM, Robert O'Callahan <robert@ocallahan.org> wrote:
> On Thu, May 24, 2012 at 4:16 PM, Robert O'Callahan <robert@ocallahan.org>
> wrote:
>>
>> Don't forget to specify what happens when the element is too big to fit in
>> the viewport.

The top left corner of the viewport should then align with the top
left corner of
the element.

If the element is bigger than the viewport vertically, the top of
the border box of the element should be on the top edge of the viewport.
If the element is bigger than the viewport horizontally, the left of
the border box of the element should be on the left edge of the viewport.

>> Also, don't forget to specify exactly what the area that is scrolled into
>> view is. Currently CSSOM View refers to "the border box of the element",
>> which is of course ill-defined since there can be zero or more border-boxes
>> for the element.

Should I redefine "the border box of the element"? I am afraid that would be
hard to do.

> Also, I believe with CSS Regions it's possible to have an element which has
> some boxes in one scrollable container and other boxes in a different
> scrollable container. I'm not sure what should happen in that case.

While I have no idea how it should work, I believe that this may not be
too important right now.
Received on Saturday, 26 May 2012 05:13:09 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:54 GMT