CSS for Star Wars-style scrolling text

Belrathius

Hi all,

I have had a request that I put up code info for my angled wall of text seen on my homepage, done strictly in HTML. It took me quite a while to get it all worked out, relying on combinations of perspective, transform, and animation. So, in the spirit of helping others not reinvent the wheel, here is the important info.

Page to view the scrolling text:
"https://gurpsspace.obsidianportal.com/":https://gurpsspace.obsidianportal.com/
Please be patient for the transitions.

Page to view the code:
"https://gurpsspace.obsidianportal.com/wikis/front-page-code":https://gurpsspace.obsidianportal.com/wikis/front-page-code

Page to view the CSS behind it:
"https://gurpsspace.obsidianportal.com/wikis/css":https://gurpsspace.obsidianportal.com/wikis/css
Note that the particular styling elements start after the /* HOMEPAGE CONTENT */ line.

I hope that multiple people out there finds this useful.

Tom a.k.a. Belrathius

GamingMegaverse

That kicks serious butt.
My only complaint would be to get rid of the terms of service, etc...
killervp
"A God...Rebuilt":https://a-god-rebuilt.obsidianportal.com
"OP's COTM April 2012":http://blog.obsidianportal.com/a-god-rebuilt-aprils-cotm/
Over 300 Fans, and Looking for More!

Belrathius

Hi KillerVP,

Thanks for the comment. I didn't even consider removing the terms of service thing, but you're right, it's much better now without it.

Tom a.k.a. Belrathius

cgregory

Very cool. Nicely done.

Bortas

Very well done, your page is great!

-bort

"Morwindl":http://morwindl.obsidianportal.com

Belrathius

Thanks for the kind words.