Mozilla Demo Studio

  • Demo insturen

Taboca Layer Station (Ported demo from 1997)

This is a demo from 1997 — Layer Station — brought back to life

Gebouwd met behulp van Audio, Lettertypen

  • 78 keer bekeken
  • 0 reacties

Meer over deze demo van de maker

This demonstration was featured at the Netscape Devedge in 1997, under innovation from third-parties. It was all written with the <layer> tag. I rewrote the demo with some DOM now simply to keep here in the Mozilla archives as a historical artifact. If you look at the markup you will see a blend of "manually written" tags with some loops to create a positioning for elements — all absolute positioning of course. The zoom animation effect, to the "welcome part" was made of a lot of "repeated font tags". The train graphic was made using Autodesk 3D studio and it took more time than the HTML web page of course.

About porting work:

I tried to add as less possible and not touch much the markup. So basically replaced the <layer /> with <div /> and changed the document.layers["layerName"] and <layer name="layerName" /> with DOM equivalent approach. The reason I decided to bring this back is because I am studying animation in HTML and the problems and solutions. This demo, as many others online, uses intensively setTimeout to keep the animation beat — the steps of the animation. Nowadays, 15 years later, a lot of pages do the same but there are some interesting options being studied — requestAnimationFrame for example. In addition a lot of intensive animation has shifted to things like CSS3. It's important to notice that even with CSS3, the programmer ( JS ) still needs to coordinate the events in time — so setTimeout still is a current scheduler.

What are other ways we can schedule events in the document and have our real-time animation projects? please join me in this quest and discussion.

Nog geen reacties.

Registreer of meld u aan om die van u toe te voegen.

De broncode verkrijgen

Download de bron 80.9 KB · ZIP-bestand

Browse the Source

Deze demo is uitgebracht onder de MPL/GPL/LGPL-licentie.

Meer van TelaSocial