<page-frame>, an outer flex container attached to, and covering, the viewport.
<frame-header> contains top menu with buttons: Home, Tracks, Repos, Stories, Resrcs, Blogs, Pref, and Next
<main> contains sub elements: <content>, <page-TOC>, and <page-sections>
<content> holds all non-menu page content
<page-TOC> contains links to all pages in this page's thread (sequence of pages linked with Next and Prev)
<page-sections> contains links to top of in-page sections
<frame-footer> contains buttons About, Sections, Pages, Prev, and Next
If you right-click on this page and select "View Page Source" you will see the structure of the elements
discussed here.
The Next and Prev buttons appear if and only if the page contains anchors with "Next" and "Prev" ids
with links to next and previous pages in its thread of linked pages.
A Pages button appears on the bottom menu if and only if the page contains an element with the "pages" id.
Since all pages in a thread belong to the thread, each page displays the same set of pages. Links to those pages are
generated with a script file, ScriptsPageFramePages.js, that adds child elements to the element with "pages"
id. That way, to add or remove a thread page only requires a change to the one script file, not to each page.
Usually, the Pages links refer only to pages in its thread. For these tests, we've made exceptions. When you click
the Pages button at the bottom, you see links to page threads PLUS a link to PageFrame3.html
to demonstrate that the Next, Prev, and Pages buttons are not shown for non-thread pages.
We also included links to PageFrameTest.html which duplicates Interesting.html contents, a top-level
page from this site and to PageFrame4.html, the result of converting BasicBites_ProgExec.html.
We did that to ensure that changing the menuing system for existing pages would be relatively straightforward.
Finally, we added a link to PageFramePrototype.html which serves as a starting point to convert pages
or create new pages that use the PageFrame framework.
The About button displays the page's last modified date and a link to a help menu that discloses a set of key commands
for common page operations.
More Page Content:
This is row #1.
This is row #2.
This is row #3.
This is row #4.
This is row #5.
This is row #6.
This is row #7.
This is row #8.
This is row #9.
This is row #10.
This is row #11.
This is row #12.
This is row #13.
This is row #14.
This is row #15.
This is row #16.
This is row #17.
This is row #18.
This is row #19.
This is row #20.
This is row #21.
This is row #22.
This is row #10.
This is row #11.
This is row #12.
This is row #13.
This is row #14.
This is row #15.
This is row #16.
This is row #17.
This is row #18.
This is row #19.
This is row #20.
This is row #21.
This is row #22.