ZIM JavaScript Framework

Canvas Components, Controls and more!

Scrollbar for CreateJS using ZIM Slider Component on the HTML 5 Canvas with JavaScript


ZIM Slider component now has an inside parameter that when set to true basically makes a scrollbar.  Try out the ZIM Bit above. Here we feature a button that is scaled to match the proportion of the content showing.  Pagedown, Pageup, arrows, scrollwheel and clicking on the bar all move the content as expected.  You could add little buttons at the top and bottom quite easily for a mimic of the system scrollbar.  Easing or damping was added to the content on the right for smoother scrolling effect.

ZIMjs is the free open source library of Interactive Media modules that works in conjunction with CreateJS and JavaScript for the HTML 5 Canvas.  There are lots of tutorials and tips on the ZIM site – why not try it out now!

2 comments on “Scrollbar for CreateJS using ZIM Slider Component on the HTML 5 Canvas with JavaScript

  1. Andrei
    September 5, 2016

    Is it possible to make this work for mobile devices? and by this, I mean that you will be able to scroll by touch inside the mask area, and not tapping the scroll bar. Thanks.


  2. Dan Zen
    September 6, 2016

    It sounds like you want the new zim.Window() http://zimjs.com/code/bits/view/window.html


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s


This entry was posted on April 11, 2016 by in components, javascript, tutorials and tagged , , , , , , , , .


%d bloggers like this: