diff options
| -rw-r--r-- | README.md | 21 | ||||
| -rw-r--r-- | css/reveal.scss | 4 |
2 files changed, 25 insertions, 0 deletions
@@ -474,6 +474,27 @@ The global presentation transition is set using the ```transition``` config valu </section> ``` +You can as well override only the appearing or the disappearing of the slide: + +```html +<section data-transition="slide"> + The train goes on … +</section> +<section data-transition="slide"> + and on … +</section> +<section data-transition="slide-in fade-out"> + and stops. +</section> +<section data-transition="fade-in slide-out"> + (Passengers entering and leaving) +</section> +<section data-transition="slide"> + And it starts again. +</section> +``` + + Note that this does not work with the page and cube transitions. diff --git a/css/reveal.scss b/css/reveal.scss index ed74153..17e0407 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -458,12 +458,14 @@ body { } @mixin transition-horizontal-past($style) { .reveal .slides>section[data-transition=#{$style}].past, + .reveal .slides>section[data-transition~=#{$style}-out].past, .reveal.#{$style} .slides>section:not([data-transition]).past { @content; } } @mixin transition-horizontal-future($style) { .reveal .slides>section[data-transition=#{$style}].future, + .reveal .slides>section[data-transition~=#{$style}-in].future, .reveal.#{$style} .slides>section:not([data-transition]).future { @content; } @@ -471,12 +473,14 @@ body { @mixin transition-vertical-past($style) { .reveal .slides>section>section[data-transition=#{$style}].past, + .reveal .slides>section>section[data-transition~=#{$style}-out].past, .reveal.#{$style} .slides>section>section:not([data-transition]).past { @content; } } @mixin transition-vertical-future($style) { .reveal .slides>section>section[data-transition=#{$style}].future, + .reveal .slides>section>section[data-transition~=#{$style}-in].future, .reveal.#{$style} .slides>section>section:not([data-transition]).future { @content; } |