How to make the scrollbar visible on "Open" part, when there are many articles?

31 views
Skip to first unread message

Frank Han

unread,
Aug 26, 2014, 1:47:44 AM8/26/14
to trees...@googlegroups.com
I'm a new user of Treeesaver. I'm checking various examples, for example "Fonts": https://github.com/Treesaver/treesaver/tree/master/examples/fonts , how to make the scrollbar visible on "Open" part, when there are many articles (See the attach picture)? I have checked with this example, when there are 9 or more articles, you cannot see full contents on an IPhone 5. Will someone know how to add a scroll effect?


sidebar scroll.png

Mark Kessler

unread,
Aug 26, 2014, 4:59:59 AM8/26/14
to trees...@googlegroups.com
You can put a "scroll" class to a figure and set a height. A sexier solution is to use something like the iScroll library, but this requires some fiddling with the treesaver code.


On Tue, Aug 26, 2014 at 7:47 AM, Frank Han <hang91h...@gmail.com> wrote:
I'm a new user of Treeesaver. I'm checking various examples, for example "Fonts": https://github.com/Treesaver/treesaver/tree/master/examples/fonts , how to make the scrollbar visible on "Open" part, when there are many articles (See the attach picture)? I have checked with this example, when there are 9 or more articles, you cannot see full contents on an IPhone 5. Will someone know how to add a scroll effect?


--
You received this message because you are subscribed to the Google Groups "Treesaver" group.
To unsubscribe from this group and stop receiving emails from it, send an email to treesaverjs...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Frank Han

unread,
Aug 26, 2014, 9:00:51 AM8/26/14
to trees...@googlegroups.com
Thank you Mark! But I didn't get it clearly... What do you mean by putting a "scroll" class to a figure and set a height? Could you give more technical details?

Frank

Mark Kessler

unread,
Aug 26, 2014, 10:24:58 AM8/26/14
to trees...@googlegroups.com
If you add a "scroll" class to the <figure> tag (see here https://github.com/Treesaver/treesaver/wiki/Figure), the framework should take care of the scrolling. The figure needs a fixed height which can be defined in CSS. 

for example:

<figure>
    <div data-sizes="default">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
    </div>
  </figure>
Reply all
Reply to author
Forward
0 new messages