CSS

CSS Animation: Airplane Banner

This video is screen capture of a CSS animation that can be found here – https://thingography.com/css-airplane-banner/ – one of my first animations – a bit crude

CSS Page Transition Animation

Page One – Losira Out These examples of true transitional web pages are based on the Curtains and Transitional Advertisements demos. Web pages can be transitioned for enhanced viewing just as photos are transitioned. Trekies will remember the beautiful Kalandan

CSS Page-2 Transition Animation

Page Two – Losira Out The Losira page transition also has an “onClick” audio as an added effect to go along with the page theme. The so called “Losira” effect was born from the Star Trek episode “That Which Survives”

Trans Man Page-2 CSS Transition

Page Two Other ideas include a monster trucks and bull-dozers pushing the page to transition… more ideas on next page… Click the buttons below to watch the ‘Trans-Man’ page transition Page 1 Page 2

Trans Man Page CSS Transition

Page One The effect is a man pushing the web page off screen forcing the next one to replace it… Click the buttons below to watch the ‘Trans-Man’ page transition Page 1 Page 2

Transitional Ads Page 2

Page Two – Horizontal Slide The idea in this example is to slide in an advertisement or notice on the page without cluttering up the page content or using popups, comparable to a commercial between television shows. Here are a

Transitional Web Page Advertisements with CSS Animation

Page One – Horizontal Slide The idea in this example is to slide in an advertisement or notice on the page without cluttering up the page content or using popups, comparable to a commercial between television shows. Here are a

CSS Photo Transitions

A CSS photo transition created with CSS transform. To replay just reload the page.

Walking Dead Zombies – CSS Animation

Walking Dead Zombies CSS Animation – Created with CSS and PNGs only.

Doctor Who – Tardis CSS Animation

POLICE PUBLIC CALL BOX POLICE PUBLIC CALL BOX POLICE PUBLIC CALL BOX POLICE PUBLIC CALL BOX Your browser does not support the audio element. The TARDIS from Doctor Who in CSS motion This modified Pure CSS version of the Tardis

The Time Tunnel CSS Animation

This was one of my first animations while learning CSS – A Television show from the 1960’s – The Time Tunnel.

CSS Star Trek Battle Animation

This Star Trek animation is best view on a large screen. With a little imagination and too many episodes of Star Trek…

Romulan Warbird Cloaking CSS Animation

Pure CSS Solar System Orbits Animation

A Pure CSS Solar System – with the exception of the background stars – all planets and animation is CSS generated.The scale of the planets and yearly orbits are somewhat scaled, with the exception of the Sun which should be

Spinning Spirals Animation – 28 Different Spirals

1 / 28 2 / 28 3 / 28 4 / 28 5 / 28 6 / 28 7 / 28 8 / 28 9 / 28 10 / 28 11 / 28 12 / 28 14 / 28 14

Pure CSS Heart & Arrow Animation

Valentine’s Day heart with arrow shot through it

Wrong Place CSS Animation

Being in the wrong place at the wrong time

CSS Swirl Animation

Transition Mix Pure CSS Animation

A fast and colorful CSS transition animation

Pure CSS Floating Sphere Intro

Thingography.com Where Colors Connect A little introduction CSS animation with flying spheres (orbs).

CSS Text Effect Animation

This text animation is played relatively slow to show the effect. The speed can be adjusted to fit your needs. Originally created to be used as a video text effect like the scrolling Star Wars text effect. The text will

Text CSS Animation – Wildcats

a m a z i n g a r i z o n a

CSS Text Animations – Arizona

a m a z i n g a m a z i n g A r i z o n a The Center of Amazing

Bull’s-eye & Arrows Pure CSS Animation

This was an enlightening project, as it showed me how flexible CSS can be with imagination. A pure CSS bulls-eye target and arrows all made with purely CSS.

Snow Falling CSS Animation

Who does not want snow falling in their website during the Christmas Holidays while not using JavaScript? An early example of falling snow using CSS and a few PNGs.

Rainbow Made with Pure CSS

The rainbows on this page are created with pure CSS. (The large background rainbow is hidden on screens less than 699px – too big to fit nicely on a small screen.) Using DIV’s with transparent backgrounds, colored borders, and

Rolling Car Wheel CSS Animation

Replay A little fun with a rolling car wheel

Pool Table and Billiard Balls Pure CSS Animation

1 2 3 4 5 14 7 8 9 10 Replay Pure CSS Pool Table and Billiard Balls

« Previous

Thingography.com