I love the fact that the scrolling text is 'contenteditable="true"'. Fun to keep typing during the animation. Very cool.
Star Wars opening crawl from 1977 in HTML/CSS/JS
51–60 of 68 posts
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#52If I remember correctly, the crawl converged in a point at about 1/3 rd from the top in the original while in this one it scrolls off the top of the screen (at least in the default view). That's a pretty big oversight.
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#53Tim, you amaze me every time. Nice job! :)
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#54There is also this one which I posted a few months ago: http://scotch.io/demos/star-wars-attack-of-the-dom
Ha. This is something I made. It never generated as much traction as my Pure CSS3 Lightsaber Checkboxes [1], but if you wait until the end of the crawl, you can take lightsabers and swing them around and hit HTML elements. Pretty neat demo, but, overall, completely useless.
The code's also on GitHub [2]. It uses HTML5, CSS3, and Box2dJS.
[1] https://github.com/scotch-io/Pure-CSS3-Star-Wars-Lightsaber-...
[2] https://github.com/scotch-io/Star-Wars-Attack-of-the-DOM
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#55Ah my eyes, the aliasing. If anybody's interested why there's aliasing it's important to know how CSS transforms work. If you transform, the browser lifts the transformed rectangle into its own layer and renders its content to a texture. Then, later, it is composited with the page by blitting that texture with whatever transformation was applied. So CSS transforms are an application of texturing. And in texturing wha…
Heh, it still feels wonderfully retro, but instead of evoking the original Star Wars, it evokes the old early-'90s PC games like X-Wing.
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#56Back in 1994, my 486 had no issue rendering the Star Wars opening crawl in a sweet game, Star Wars: TIE Fighter. Fast forward 20 years, and thanks to the wonders of web, my computer can't even render it correctly. I get a blank screen after the star wars logo. So much for progress. http://www.youtube.com/watch?v=IYks9ZfupZ0
To a tech naive eye, this CSS looks and sounds much better than the 486 version. If I had to show my granny my first pc (a ~20 kilos 486) playing the game intro and a retina ipad rendering this css effect, she'd probably be amazed by tech progress in these last 20 years. Further, I can't see how the next 20 years may produce a greater improvement in this render than the past 20s. It's probably just that we can't full…
Actually, on my retina iPad this demo doesn't work at all. You hear the music, but no visuals appear.
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#57Earlier quoted context omitted.
No, not the remastered version! Nooooooo!
The subtitle was added to second run theatre prints. Long before the remastering.
True, but more people are likely to think of the subtitle as being canonical due to repeated watchings on VHS or DVD than theatre reruns.
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#58Back in 1994, my 486 had no issue rendering the Star Wars opening crawl in a sweet game, Star Wars: TIE Fighter. Fast forward 20 years, and thanks to the wonders of web, my computer can't even render it correctly. I get a blank screen after the star wars logo. So much for progress. http://www.youtube.com/watch?v=IYks9ZfupZ0
Yes, who could have guessed we would still have bugs in the 21st century, right?
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#59Cool, but sadly to me this is almost a parody of how modern web dev innovation HTML5/JS/CSS are so far behind the technology that actually exists in the world today (this was originally created in 1977). Web standards are good, but much faster and be far more "open" and expandable. One suggestion. Don't just create a standard for (monopoly) ECMA Script, instead - create a standard for a VM that other languages can co…
> Don't just create a standard for (monopoly) ECMA Script, instead - create a standard for a VM that other languages can compile bytecode to. Create an API in this VM for graphics, video, audio, ETC. Please no. That's the opposite of where we should be going. Less executable code on the client, more powerful markup. JavaScript was a huge mistake that we will likely have to live with for decades, let's not compound it…
>Less executable code on the client, more powerful markup. JavaScript was a huge mistake that we will likely have to live with for decades, let's not compound it.
That ship has well and truly sailed. Mozilla and Google both want to make the web into a general purpose app platform, and they have veto power over any proposed standards. Admittedly they both want a slightly different version of the idea (asm.js vs Dart or NaCl), but that gridlock just leaves us investing even more heavily into the current Javascript ecosystem.
Re: Star Wars opening crawl from 1977 in HTML/CSS/JS
#60Earlier quoted context omitted.
Are you able to upload a screenshot of the aliasing problem somewhere? Running on a retina MBP, both Safari and Chrome render the text pin-sharp with no noticeable aliasing.
http://i.imgur.com/UzZYLW5.png Check the farthest text. It's even worse in motion because the aliasing changes discretely.
Speaking as an old guy who saw Star Wars in the theater, it looked like that in 1977 as well. Not because of aliasing problems, but because they hit the resolution of the 35mm film and transfer process.