Før musen over ikonerne for at se effekten

Mappe Zoom RSS Hjem Check Musik Tilbage Frem Rul ned Rul op Pause Stop Første Sidste Luk 1 Luk 2 Gem Bruger Lydløs Lyd ned Lyd op Blyant Tale PC Udskriv Dokument Post Telefon Foto Film Papirkurv Venstre Højre Op Ned Del

Nillervision 2014

Download source-filer

Om ikonerne

Shaded 3d Icon Pack består af 36 PNG-filer med gennemsigtig baggrund. Hver fil har en "normal" -og en "hover"-tilstand. Jeg har modeleret Ikonerne i 3D i høj opløsning. Pakken indeholder desuden HTML og CSS kilde-kode.

Hvordan virker det?

Animationen af ikonerne består udelukkende af css-kode og understøttes af alle moderne browsere. Hvert ikon består af en billedfil, der er 200 pixels bred, med to billeder side om side. Billedfilerne bliver angivet som background-image property med på de forskellige elementer med css. De ønskede elemeter får angivet en bredte på 100px og viser derfor kun første del af billedet (da baggrundsbilleder pr. default vises fra venstre). For elementernes hover-tilstand sættes en background-position property til værdien "right" hvilket får billedet til at flytte sig så hover-delen af billedet bliver synlig i stedet.