How to Create ‘Coda’ like Scrolling Window using Mootools?

May 30, 2007

The scrolling window at Panic’s coda website pretty impressive. I didnt go through their javascript but as I already worked on Mooltools Scroll functionality, I know its not that hard to create same effect in Mootools.  Mootools is a lightweight javascript library and is pretty easy to playwith.

Look at my website or other website I designed (where combined with nifty corners)  for similar effect I got using mootools.  I am cleaning my code to post it on blog soon.

 Update:

I posted the source code here

Advertisements

3 Responses to “How to Create ‘Coda’ like Scrolling Window using Mootools?”


  1. I looked at your horizontal & vertical scrolling/sliding … it somehow related to a concept I am working on now … scrollscapes which need to have a combination of horizontal and vertical scrolling all in one (big) window; if you are interested I can see you a (semi-public) link… I foudn your coda/scrolling page because I was testing fx.scroll (Mootools) & have just one problem… it uses a background image… (and I am making very large, mostly horizontal scrolls 10, 20 up to 50.000 pixels…; so I mostly use simpe chopped up large files inside a table or a ApDiv or div … I will be all happy when I can load a lsiced image into the fx.scroll routine; somehow it seems you are using the ‘background image’ standard in a different way … I you can be so nice and look at two test examples (never mind the design is work in progres) link 1 is how i want to parade rhough a horiz. scroll link 2 is the actual side that needs to be scrolled by dragging now … 1) http://imaginarymuseum-archive.org/OPTMtest/test_sliding/index3.html 2) below and the info foreground will fade away … = toggle so while panning the info will be away and while halting the info fades in again. I would appreciate your suggestions/comment


  2. ciao!

    i’m working to your concept on my site. have a look and thank you.


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 )

Google+ photo

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

Connecting to %s

%d bloggers like this: