Polymer core-scaffold scroll to top

Question

After some search I found that I could scroll core-header-panel by scroller property, but I cannot apply the same thing to core-scaffold.

Is there any way to scroll core-scaffold to the top ??

Answer 1

A core-scaffold element is just a collection of a bunch of other core elements with a bit of commonly used functionality. If the documentation doesn't answer your question one tip is to just look inside the source of the element.

That's for example the content of the core-scaffold.

<div vertical layout drawer>

  <content select="[navigation], nav"></content>

</div>

<core-header-panel id="headerPanel" main mode="{{mode}}">

  <core-toolbar>
    <core-icon-button id="menuButton" icon="menu" on-tap="{{togglePanel}}"></core-icon-button>
    <content select="[tool]"></content>
  </core-toolbar>

  <content select="*"></content>

</core-header-panel>

The .$ property will contain a path to any element by its id. So $.yourScaffoldID.$.headerPanel is a path you can use to access it through javascript or data-binding.

Answer 2

Thanks to @Winchestro answer,

I could solve it by defining a scroller property for my custom-core-scaffold and make it return the core-header-panel scroller.

get scroller() {
  return this.$.headerPanel.scroller;
}