[jQuery] typeWritr - WAS jdNewsScroll - Headline Scroller
From:
discuss-bounces@jquery.com [mailto:discuss-bounces@jquery.com] On
Behalf Of Sam Collett
Subject: Re: [jQuery] jdNewsScroll - Headline Scroller
What I want to know is how to do a typewriter effect (i.e. type from
right to left single letters until the entire text is written).
-----
I do like a challenge :) Though, I'm sure someone will be able to do
this better than I. Note, this is just tested on Win/FF2.0. You're on
your own as far as other browsers go.
I had to do some CSS tricks to make it work, due to jQuery's animation
class adding 'display:block' to the elements it messes with. Take a
look at the code and I'll explain.
CSS - http://pastie.caboo.se/29059
JS - http://pastie.caboo.se/29062
HTML - http://pastie.caboo.se/29064
In the CSS we set the containing element's height to 1.125em and
'overflow:hidden'. That way, when jQuery forces 'display:block' on the
span element it is animating, it doesn't appear as if the line is
jumping all over the place. If you take off the 'overflow:hidden'
you'll see what I mean.
HTML just shows the basic setup I used to test.
Hope this steers you in the right direction.
-ALEX
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/