Commit d457b927 authored by Leonardo Kewitz's avatar Leonardo Kewitz
Browse files

Added 4 fragment transitions effect.

parent bef2722e
This diff is collapsed.
......@@ -137,6 +137,54 @@ html:-moz-full-screen-ancestor {
}
}
.reveal .slides section .fragment.fade-up {
opacity: 0;
transform: translate(0, 20%);
visibility: hidden;
&.visible {
opacity: 1;
transform: translate(0, 0);
visibility: visible;
}
}
.reveal .slides section .fragment.fade-down {
opacity: 0;
transform: translate(0, -20%);
visibility: hidden;
&.visible {
opacity: 1;
transform: translate(0, 0);
visibility: visible;
}
}
.reveal .slides section .fragment.fade-right {
opacity: 0;
transform: translate(-20%, 0);
visibility: hidden;
&.visible {
opacity: 1;
transform: translate(0, 0);
visibility: visible;
}
}
.reveal .slides section .fragment.fade-left {
opacity: 0;
transform: translate(20%, 0);
visibility: hidden;
&.visible {
opacity: 1;
transform: translate(0, 0);
visibility: visible;
}
}
.reveal .slides section .fragment.current-visible {
opacity: 0;
visibility: hidden;
......@@ -1375,5 +1423,3 @@ html:-moz-full-screen-ancestor {
.zoomed .reveal .roll span:after {
visibility: hidden;
}
......@@ -139,6 +139,7 @@
<p class="fragment grow">grow</p>
<p class="fragment shrink">shrink</p>
<p class="fragment fade-out">fade-out</p>
<p class="fragment fade-up">fade-up (also down, left and right!)</p>
<p class="fragment current-visible">current-visible</p>
<p class="fragment highlight-red">highlight-red</p>
<p class="fragment highlight-blue">highlight-blue</p>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment