Not really...but sort of... :-) Read on...
Your example removed the reliance on the 'core-scaffold'. Rather, it seems
you went about using it's individual components to recreate similar, but
slightly different behaviour. In trying to implement your example into my
existing site, it highlighted for me what was causing the appearance of
multiple scrollbars. In my initial jsbin sample code, you'll notice I have
specified core-pages height as '100vh' the top level polymer element (i.e.
my-app-element). The second level polymer element (i.e.
my-scaffold-page-element)...which it seems you've been focusing on
fixing...loads within the aforementioned core-pages. Therefore, the nested
scaffold element's *maximum* height is 100vh. Further down the chain, when
the scaffold-element's main content area's height flows past its host's
height limitation, it caused a secondary 'inner' scrollbar to appear, which
has a different vertical extent than the original outer scrollbar...so
trying to use the outer scrollbar alone doesn't effectively scroll the
inner content to its entire vertical extent...forcing you to use the inner
scrollbar as well to get the job done. Ugly to say the least.
Now that I know that is the case, one way to reduce the likelihood of an
inner scrollbar appearing for the nested scaffold element's main content
area is to change it's parent element's core-pages height to something much
greater than 100vh (300 or 400vh perhaps?). Doing so solves the problem in
a roundabout way. The outer scrollbar can now be used to scroll the entire
vertical extent of the nested scaffold's contents without an inner
scrollbar occurring. However, there is a catch...
It creates a side-effect I don't much like. Now, I cannot seem to 'fix'
the drawer panel's header/main content toolbar (using your solution code)
in place so they do not scroll with the content. I've tried setting
different modes on core-header-panel and also tried using
core-scroll-header-panel in place of core-header-panel along with it's
'fixed' attribute enabled...but no dice!
If this isn't a clear explanation, just let me know and I can update the
jsbin with what I currently have.
Thanks again Rob,
Kelly
On Thursday, 4 December 2014 17:48:29 UTC-8, Rob Dodson wrote:
>
> Let's give this one a shot: http://jsbin.com/wiweta/20/edit
>
> is that closer to what you're after?
>
> On Thu, Dec 4, 2014 at 5:42 PM, Kelly St. John <[email protected]
> <javascript:>> wrote:
>
>> Hi Rob,
>>
>> Yes, I'd like to have a visible drawer / side menu on desktop that slides
>> away on mobile, and on mobile can be reopened via swipe or via tapping
>> drawer icon (default scaffold functionality I believe).
>>
>> Thanks again for looking into this for me!
>>
>>
>> On Thursday, 4 December 2014 17:35:10 UTC-8, Rob Dodson wrote:
>>>
>>> Do you want a visible drawer on desktop?
>>>
>>> On Wed, Dec 3, 2014 at 4:14 PM, Kelly St. John <[email protected]> wrote:
>>>
>>>> Hi Rob,
>>>>
>>>> Thanks again for the reply. To clarify, I'm not necessarily looking
>>>> for the left menu header (drawer header) to collapse along with the
>>>> content
>>>> of the main page. Currently, core-scroll-header-panel is the top level
>>>> element (#appHeader), which has the scrollAwayTopbar attribute set...hence
>>>> it slides away when the outside scrollbar is utilized (desired behaviour).
>>>>
>>>> That said, the problem is the the same outer scrollbar does not currently
>>>> scroll the inner content (i.e. within the scaffold main content) to its
>>>> full vertical extent.
>>>>
>>>> I hope that description helps...
>>>>
>>>> Kelly
>>>>
>>>> On Wednesday, 3 December 2014 14:59:12 UTC-8, Rob Dodson wrote:
>>>>>
>>>>> Hm... I can get part of the way there: http://jsbin.com/wiweta/17/edit
>>>>>
>>>>> However I'm not sure how to make the menu header collapse along with
>>>>> the content of the main page. Frankie do you have any ideas?
>>>>>
>>>>> On Tue, Dec 2, 2014 at 10:29 AM, Kelly St. John <[email protected]>
>>>>> wrote:
>>>>>
>>>>>> I've posted the issue description along with a jsbin on Stack
>>>>>> Overflow for your review:
>>>>>>
>>>>>> http://stackoverflow.com/questions/27241020/polymer-nested-
>>>>>> core-scaffold-and-multiple-vertical-scrollbars-scrolling-extent
>>>>>>
>>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>>>>>> ---
>>>>>> You received this message because you are subscribed to the Google
>>>>>> Groups "Polymer" group.
>>>>>> To unsubscribe from this group and stop receiving emails from it,
>>>>>> send an email to [email protected].
>>>>>> To view this discussion on the web visit https://groups.google.com/d/
>>>>>> msgid/polymer-dev/18b4e43e-cf1b-46dd-8f43-451f69224d8d%40googl
>>>>>> egroups.com
>>>>>> <https://groups.google.com/d/msgid/polymer-dev/18b4e43e-cf1b-46dd-8f43-451f69224d8d%40googlegroups.com?utm_medium=email&utm_source=footer>
>>>>>> .
>>>>>> For more options, visit https://groups.google.com/d/optout.
>>>>>>
>>>>>
>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>>>> ---
>>>> You received this message because you are subscribed to the Google
>>>> Groups "Polymer" group.
>>>> To unsubscribe from this group and stop receiving emails from it, send
>>>> an email to [email protected].
>>>> To view this discussion on the web visit https://groups.google.com/d/
>>>> msgid/polymer-dev/40ff0a77-11da-4a0f-9077-295da686228a%
>>>> 40googlegroups.com
>>>> <https://groups.google.com/d/msgid/polymer-dev/40ff0a77-11da-4a0f-9077-295da686228a%40googlegroups.com?utm_medium=email&utm_source=footer>
>>>> .
>>>>
>>>> For more options, visit https://groups.google.com/d/optout.
>>>>
>>>
>>> Follow Polymer on Google+: plus.google.com/107187849809354688692
>> ---
>> You received this message because you are subscribed to the Google Groups
>> "Polymer" group.
>> To unsubscribe from this group and stop receiving emails from it, send an
>> email to [email protected] <javascript:>.
>> To view this discussion on the web visit
>> https://groups.google.com/d/msgid/polymer-dev/5e2b3506-ed78-4f8a-8a46-0d6470e57c44%40googlegroups.com
>>
>> <https://groups.google.com/d/msgid/polymer-dev/5e2b3506-ed78-4f8a-8a46-0d6470e57c44%40googlegroups.com?utm_medium=email&utm_source=footer>
>> .
>>
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/41e14b6e-3ea1-4085-955d-ed8fc307a71a%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
