Sean
Sean

Reputation: 2529

How to scroll to the bottom of a Polymer 1.0 paper-drawer-panel

I am using pure Polymer/Javascript and need to scroll to the bottom of my main panel. Since it is a scrollable element within a fixed-size container the typical JS answer

window.scrollTo(0,document.body.scrollHeight);

Does not work.

Upvotes: 0

Views: 846

Answers (2)

stackPete
stackPete

Reputation: 83

I may not comment (I need 50 points of something) but scrollIntoView() is experimental technology. Not supported by Chrome.

Upvotes: 0

Sean
Sean

Reputation: 2529

Couldn't find a direct solution so posting an the answer myself. Hope this helps someone :)

(Based on what I found here)

//Get the main paper-drawer-panel element
    a = document.querySelector("paper-drawer-panel [main]")

//use the undocumented scroller property and set it to the scroller's height
    a.scroller.scrollTop = a.scroller.scrollHeight

UPDATE:

I also discovered that if you select any element or container within the panel there should be scrolling methods attached to them allowing you to to scroll to the top or bottom of the panel based on the selected element.

//Get the main paper-drawer-panel element
    a = document.querySelector("some-element-container-in-paper-panel");
// Passing in false scrolls to the bottom of the container, no param to the top.
    a.scrollIntoView(false)

Upvotes: 2

Related Questions