Changes

Jump to navigation Jump to search

Lalafly (view source)

Revision as of 00:58, 1 February 2023

11,780 bytes added ,  00:58, 1 February 2023
no edit summary
Line 7: Line 7:  
== Range ==
 
== Range ==
 
Lalaflies are endemic to [[Lake Baikal]], but have flourished in areas they have been introduced to as an invasive species. Notable lalafly populations exist in [[Lake Ladoga]], [[Saimaa]], and the [[California]] coast.
 
Lalaflies are endemic to [[Lake Baikal]], but have flourished in areas they have been introduced to as an invasive species. Notable lalafly populations exist in [[Lake Ladoga]], [[Saimaa]], and the [[California]] coast.
−
[[Category:Seals]]
+
 
 +
== Swarming ==
 +
{{#css:
 +
.walkcake {
 +
position: relative;
 +
height: 100%;
 +
width:inherit;
 +
margin-right:margin-left
 +
text-align: left;
 +
transform:translateX(0%);
 +
animation: move 3s ease-in-out infinite alternate-reverse;
 +
}
 +
@keyframes move {
 +
0% {transform: translateX(0%);}
 +
100% {transform: translateX(55%);}
 +
}
 +
}}
 +
{{#css:
 +
@keyframes move {
 +
0% {transform: translateX(0%);}
 +
100% {transform: translateX(50%);}
 +
}
 +
.shrubcake {
 +
animation: shrubcakeAnim 0.5s linear infinite alternate-reverse;
 +
}
 +
@keyframes shrubcakeAnim{
 +
  0% { transform: translate(0.1px, -0.1px) rotate(0.5deg); scaleY(1);}
 +
  20% { transform: translate(-0.1px, 0.1px) rotate(-0.5deg) scaleY(1.05);}
 +
  40% { transform: translate(0.1px, -0.1px) rotate(0.5deg) scaleY(1);}
 +
  60% { transform: translate(-0.1px, 0.1px) rotate(-0.5deg) scaleY(0.95);}
 +
  80% { transform: translate(0.1px, -0.1px) rotate(0.5deg) scaleY(1);}
 +
  100% { transform: translate(-0.1px, 0.1px) rotate(-0.5deg) scaleY(1.05);}
 +
}}
 +
{{#css:
 +
.yturn {
 +
animation: yturn 5s ease-in-out infinite;
 +
}
 +
.xturn {
 +
animation: xturn 11s ease-in-out infinite;
 +
}
 +
.zturn {
 +
animation: zturn 13s linear infinite;
 +
}
 +
 
 +
@keyframes yturn {
 +
  0% { transform: scaleX(1); }
 +
  50% { transform: scaleX(-1); }
 +
  100% { transform: scaleX(1); }
 +
}
 +
@keyframes xturn {
 +
  0% { transform: scaleY(1); }
 +
  50% { transform: scaleY(-1); }
 +
  100% { transform: scaleY(1); }
 +
}
 +
@keyframes zturn {
 +
  0% { transform: rotate(0deg); }
 +
  25% { transform: rotate(-90deg); }
 +
  50% { transform: rotate(-180deg); }
 +
  75% { transform: rotate(-270deg); }
 +
  100% { transform: rotate(-359deg); }
 +
}
 +
}}
 +
 
 +
{{#css:
 +
.scenecake {
 +
width: 200px;
 +
height: 200px;
 +
perspective: 600px;
 +
margin: 100px;
 +
}
 +
 
 +
.cube {
 +
width: 100%;
 +
height: 100%;
 +
position: relative;
 +
transform-style: preserve-3d;
 +
animation: rotatey 5s linear infinite;
 +
}
 +
 
 +
.cube-facecake {
 +
position: absolute;
 +
width: 200px;
 +
height: 200px;
 +
}
 +
.facecake-front  { transform: rotateY(  0deg) translateZ(00px); background-color: rgba(255, 0, 0, 0); }
 +
.facecake-right  { transform: rotateY( 90deg) translateZ(00px); background-color: rgba(255, 255, 0, 0); }
 +
.facecake-back  { transform: rotateY(180deg) translateZ(00px); background-color: rgba(0, 255, 0, 0); }
 +
.facecake-left  { transform: rotateY(-90deg) translateZ(00px); background-color: rgba(0, 255, 255, 0); }
 +
.facecake-top    { transform: rotateX( 90deg) translateZ(00px); background-color: rgba(0, 0, 255, 0); }
 +
.facecake-bottom { transform: rotateX(-90deg) translateZ(00px); background-color: rgba(255, 0, 255, 0); }
 +
@keyframes rotatey {
 +
0% { transform: rotate3d(0, 0, 1, 0deg); }
 +
100% { transform: rotate3d(1, 0, 1, 360deg); }
 +
}
 +
/* most of the css was taken from https://3dtransforms.desandro.com/cube */
 +
}}
 +
<div class="zturn"><div class="xturn"><div class="yturn">
 +
<noinclude>
 +
<div class="scenecake">
 +
<div class="cube">
 +
<div class="cube-facecake facecake-front"><div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div></div>
 +
<div class="cube-facecake facecake-back"><div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div></div>
 +
<div class="cube-facecake facecake-right"><div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div></div>
 +
<div class="cube-facecake facecake-left"><div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div></div></div>
 +
<div class="cube-facecake facecake-top"></div>
 +
<div class="cube-facecake facecake-bottom"></div>
 +
</div>
 +
</div></div></div>
 +
</noinclude>
 +
<div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div>
 +
<div style="transform: scale(0.500,0.500)">
 +
<div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div>
 +
</div>
 +
<div style="transform: scale(0.300,0.300)">
 +
<div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div>
 +
</div>
 +
{{#css:
 +
.nyarpa h1{
 +
position: absolute;
 +
width: 350%;
 +
height: 100%;
 +
margin: 0;
 +
font-size: 42px;
 +
text-align: center;
 +
transform:translateX(-100%);
 +
animation: cssmarquee 4s linear infinite;
 +
}
 +
@keyframes cssmarquee {
 +
0% {transform: translateX(-100%)}
 +
100% {transform: translateX(100%)}
 +
}
 +
}}
 +
<div class="nyarpa">
 +
<h1><div class="shrubcake";>{{Loop|20|[[File:Lalaflight.gif]]}}</div><div class="shrubcake";>[[File:Lalaflight.gif]]</div><div class="shrubcake";>[[File:Lalaflight.gif]]</div><div class="shrubcake";>[[File:Lalaflight.gif]]</div></h1>
 +
</div>
 +
<div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div>
 +
<div style="position: fixed; left:8px; bottom: 2%; z-index: 9000;">[[File:Lalaflight.gif|100px]]</div>
 +
<div style="position: fixed; left:8px; top: 2%; z-index: 9000;">[[File:Lalaflight.gif|100px]]</div>
 +
<div style="position: fixed; right:8px; top: 2%; z-index: 9000;">[[File:Lalaflight.gif|100px]]</div>
 +
<div style="position: fixed; right:8px; bottom: 2%; z-index: 8999;">[[File:Lalaflight.gif|100px]]</div>
 +
<div style="transform: scale(0.500,0.500)">
 +
<div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div>
 +
</div>
 +
<div style="transform: scale(0.300,0.300)">
 +
<div class="shrubcake";><div class="walkcake">[[File:Lalaflight.gif]]</div></div>
 +
</div>
 +
{{#css:
 +
@keyframes blow {
 +
50% {transform: scale(.3,.3);}
 +
100% {transform: scale(2,2);}
 +
}
 +
.bobbul {
 +
animation: blow 1.5s alternate infinite;
 +
}
 +
}}
 +
<div class="shrubcake";><div class="walkcake"><div class="bobbul">{{Loop|3|[[File:Lalaflight.gif]]}}</div></div></div>
 +
{{#css:
 +
.scenecake {
 +
position: relative;
 +
top: 30px;
 +
left: 350px;
 +
width: 200px;
 +
height: 200px;
 +
perspective: 600px;
 +
}
 +
.dodecahedron1 {
 +
width: 100%;
 +
height: 100%;
 +
position: relative;
 +
transform-style: preserve-3d;
 +
animation: rotatey1 7s linear infinite;
 +
}
 +
 
 +
.dodecahedron2 {
 +
width: 100%;
 +
height: 100%;
 +
position: relative;
 +
transform-style: preserve-3d;
 +
animation: rotatey2 5s linear infinite;
 +
}
 +
 
 +
.dodecahedron3 {
 +
width: 100%;
 +
height: 100%;
 +
position: relative;
 +
transform-style: preserve-3d;
 +
animation: rotatey3 9s linear infinite;
 +
}
 +
 
 +
.cube-facecake {
 +
position: absolute;
 +
width: 200px;
 +
height: 200px;
 +
}
 +
.facecake-front  { transform: rotateY(  0deg) translateZ(100px); -webkit-transform: rotateY(  0deg) translateZ(100px); background-color: white; }
 +
.facecake-right  { transform: rotateY( 90deg) translateZ(100px); -webkit-transform: rotateY( 90deg) translateZ(100px); background-color: white; }
 +
.facecake-back  { transform: rotateY( 180deg) translateZ(100px); -webkit-transform: rotateY( 180deg) translateZ(100px); background-color: white; }
 +
.facecake-left  { transform: rotateY( -90deg) translateZ(100px); -webkit-transform: rotateY( -90deg) translateZ(100px); background-color: white; }
 +
.facecake-top    { transform: rotateX( 90deg) translateZ(100px); -webkit-transform: rotateX( 90deg) translateZ(100px); background-color: white; }
 +
.facecake-bottom { transform: rotateX( -90deg) translateZ(100px); -webkit-transform: rotateX( -90deg) translateZ(100px); background-color: white; }
 +
.pentagon {
 +
position: absolute;
 +
width: 200px;
 +
height: 200px;
 +
border-radius: 100px;
 +
}
 +
.pentagon img {
 +
position: absolute;
 +
top: 50%;
 +
left: 50%;
 +
transform: translate(-50%, -50%);
 +
}
 +
.f01 { transform: translateZ(100px); }
 +
.f02 { transform: rotate3d( 0,1,0, 58.282525deg) translateZ(100px);}
 +
.f03 { transform: rotate3d( 2.5,1,0, 58.282525deg) translateZ(100px);}
 +
.f04 { transform: rotate3d(-2.5,1,0, 58.282525deg) translateZ(100px);}
 +
.f05 { transform: rotate3d( 0.75,1,0,-58.282525deg) translateZ(100px);}
 +
.f06 { transform: rotate3d(-0.75,1,0,-58.282525deg) translateZ(100px);}
 +
.f07 { transform: translateZ(-100px);}
 +
.f08 { transform: rotate3d( 0,1,0, 58.282525deg) translateZ(-100px);}
 +
.f09 { transform: rotate3d( 2.5,1,0, 58.282525deg) translateZ(-100px);}
 +
.f10 { transform: rotate3d(-2.5,1,0, 58.282525deg) translateZ(-100px);}
 +
.f11 { transform: rotate3d( 0.75,1,0,-58.282525deg) translateZ(-100px);}
 +
.f12 { transform: rotate3d(-0.75,1,0,-58.282525deg) translateZ(-100px);}
 +
@keyframes rotatey1 {
 +
0% { transform: rotate3d(0, 0, 1, 0deg); }
 +
100% { transform: rotate3d(0, 0, 1, 360deg); }
 +
}
 +
@keyframes rotatey2 {
 +
0% { transform: rotate3d(0, 0, 1, 0deg); }
 +
100% { transform: rotate3d(0, 1, 0, 360deg); }
 +
}
 +
@keyframes rotatey3 {
 +
0% { transform: rotate3d(0, 0, 1, 0deg); }
 +
100% { transform: rotate3d(1, 0, 0, 360deg); }
 +
}
 +
}}
 +
<div class="scenecake">
 +
<div class="dodecahedron1">
 +
<div class="dodecahedron2">
 +
<div class="dodecahedron3">
 +
<div class="pentagon f01"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f02"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f03"><div class="shrubcake";>[[File:Lalaflight.gif]]</div>]</div>
 +
<div class="pentagon f04"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f05"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f06"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f07"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f08"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f09"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f10"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f11"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
<div class="pentagon f12"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<br><br>
 +
<div class="rotate"><div class="shrubcake";>[[File:Lalaflight.gif]]</div></div>
 +
 
 +
 
 +
 
 +
 
 +
{{#css:
 +
@keyframes rot {
 +
100% {transform: rotate(1turn);}
 +
}
 +
.rotate {
 +
animation: rot 1s linear infinite;
 +
}
 +
}}
 +
<div class="shrubcake";><div class="walkcake"><div class="bobbul">
 +
<div class="scenecake">
 +
<div class="dodecahedron1">
 +
<div class="dodecahedron2">
 +
<div class="dodecahedron3">
 +
<div class="pentagon f01"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f02"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f03"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f04"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f05"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f06"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f07"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f08"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f09"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f10"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f11"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
<div class="pentagon f12"><div class="angry"><div class="shrubcake";>{{blink|[[File:Lalaflight.gif]]}}</div></div></div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div></div>
 +
{{#css:
 +
.angry{
 +
animation: angry 0.4s linear infinite;
 +
animation-direction: alternate;
 +
}
 +
@keyframes angry {
 +
0% {filter: saturate(1) contrast(1);}
 +
100% {filter:saturate(2) contrast(4);}
 +
}
 +
}}
 +
{{#css:
 +
.nyarpan h1{
 +
position: absolute;
 +
width: 350%;
 +
height: 500%;
 +
margin: 0;
 +
font-size: 42px;
 +
text-align: center;
 +
transform:translateX(-100%);
 +
animation: cssmarquee 17s linear infinite;
 +
}
 +
@keyframes cssmarquee {
 +
0% {transform: translateX(-100%)}
 +
100% {transform: translateX(100%)}
 +
}
 +
}}
 +
<noinclude>
 +
</noinclude>
 +
</div></div></div></div></div></div>
 +
 
 +
 
 
[[Category:Insects]]
 
[[Category:Insects]]
GopyXP
9,821

edits

Retrieved from "https://camp2.rectangle.zone/index.php?title=Special:MobileDiff/49030"

Navigation menu