User Tools

Site Tools


location:luebeck:2015-05-11:css3

Demo: Möglichkeiten von CSS3 | Albert

http://cssplay.co.uk
Was ist die früheste IE-Version, die ihr unterstützt?
Alle: IE 9
Nehmt ihr JS als gegeben an?
Alle: fast alle „Ja“. Einer nutzt <noscript>, um darauf hin zu weisen, dass JS aktiviert werden sollte, damit die Seite sonst nicht genutzt werden kann. Fazit: JS sehr sinnvoll für WebApps. Bei klassischen Webseiten (HTML + Gestaltung), braucht man es nicht wirklich.

http://www.cssplay.co.uk/menu/
http://www.cssplay.co.uk/menu/cssplay-left-right-slideshow.html
CSS oft schneller als JS, animiert besser. Inzwischen ist CSS performanter als JS.
Beispiel: Slideshow mit CSS ohne JS.
http://www.cssplay.co.uk/menu/cssplay-f1-auto-play.html
Beispiel: eine weitere beliebte Form der Slideshow
http://www.cssplay.co.uk/menu/cssplay-tictactoe-css-only.html
CSS ist touringvollständig → Mit CSS Tic-Tac-Toe gegen den Computer spielen. http://www.cssplay.co.uk/menus/cssplay-mega-menu.html
Alle so: Wow!
Ist trivial zu machen und sieht beeindruckend aus.
http://caniuse.com/#search=transition
http://www.cssplay.co.uk/menus/cssplay-flexbox-droplist.html
Fazit: Man viel schöne Sachen machen, zwar erst ab IE 10 aber dafür mit JavaScript.

http://threejs.org/examples
Es ist damit Möglich Spiele wie Quake 2 und Quake 3 im Browser zu spielen. Außerdem kann man 3D-Objekte im Browser darstellen und Leute im Browser rumlaufen lassen.
Alle so: Krass!

http://www.quakejs.com
Der Code liegt auch auf GitHub
Anmerkung: local storage hat nur 5 MB

http://codepen.io/
CSS3 kann man auch für eine schöne Meldung nutzen, die anzeigt, dass JS nicht aktiviert ist. Der Button in dem obigen Beispiel ist einfach nur ein Label für die Checkbox. Das erlaubt es so ein Fenster ohne JS dann auch weg zu klicken.

« zurück zur Übersicht des 11.05.2015
« zurück zur Übersicht des Lübecker Web Montags

location/luebeck/2015-05-11/css3.txt · Last modified: 2021/03/04 23:34 by 116.202.237.215