Beispiel:CSS3 transform-rotate3d-2.html
Aus SELFHTML-Wiki
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" >
<link rel="stylesheet" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css" >
<title>Drehen mit rotate3d()</title>
<style>
.openingcrawl {
background: black;
color: gold;
width: 30em;
transform: perspective(333px) rotate3d(1,0,0,20deg);
overflow: hidden;
border-radius: 0.5em;
height: 20em;
margin: 1em 3em;
padding: 1em;
}
.text {
animation: crawl 12s linear infinite;
}
.text a {color:yellow;}
@keyframes crawl {
0% {transform: translate3d(0,0,0); }
100% {transform: translate3d(0,-40em,0); }
}
</style>
</head>
<body>
<h1>Drehen mit <code>rotate3d()</code></h1>
<section class="openingcrawl">
<div class="text">
<h2>Das Wars</h2>
<p>In einer weit, weit enfernten Galaxis ....</p>
<p>Der Krieg der Sterne bezeichnet die intergalaktischen Auseinandersetzungen zwischen den komischen
Bewohnern der Planeten Mars, Melmac und Riegel IV.
Der Krieg wurde ursprünglich durch einen Streit verursacht, in dem es darum ging, wer den schokoladigsten
Schokoladenriegel herstellt. Bekannt geworden ist der Krieg der Sterne durch den gleichnamigen
Dokumentarfilm, der von George Schorsch Lucas-Podolski verfilmt wurde.</p>
<p>Der Krieg der Sterne fand vor langer, langer Zeit in einer weit, weit entfernten Galaxis statt. Vor
langer, langer Zeit heißt jetzt nicht gestern oder vorgestern, sondern vor Manometer, das ist jetzt aber
mal wirklich ganz schön lange her-Zeit - also ungefähr in den 80er Jahren. Und mit weit, weit entfernt
ist auch nicht so eine Entfernung wie z.B. von Köln-Kalk nach Bottrop (das ist geradezu ein Katzensprung
dagegen) gemeint, sondern echt super verdammt noch mal ist das weit weg-entfernt. Mindestens 24,7
Parsec.
</p>
<p>Auf bisher unbekannten Wegen (eventuell hatte auch hier Mulahama seine Hände im Spiel) gerieten die
Aufzeichnungen über diesen Krieg jedoch in die Hände des bis dato ebenso unbekannten Regisseurs George
Schorsch Lucas-Podolski und wurden fortan als Lucas-Evangelium bezeichnet. Dieser machte daraus einen
Dokumentarfilm, der aus mehreren Teilen bestand. Lucas-Podolski war damit der Erfinder der mehrteiligen
Kriegsdokumentation, noch weit vor Guido Knopp, der dieses Konzept später übernahm. Dafür erhielt Lucas-
Podolski später sogar den Nobelpreis.</p>
<p>Da Lucas-Podolski die Aufzeichnungen erst nach und nach entschlüsseln konnte, drehte er zuerst den
vierten bis sechsten Teil und anschließend den ersten bis dritten Teil.</p>
<p>Quelle: <a href="http://www.stupidedia.org/stupi/Krieg_der_Sterne"> Stupidedia</a></p>
</div>
</section>
</body>
</html>
