Adding one-sided transitions
Now the transition isn’t any more „per slide“ but „per movement of a slide“. So the slide can disappear in another way than it appeared.
This commit is contained in:
		
							
								
								
									
										21
									
								
								README.md
									
									
									
									
									
								
							
							
						
						
									
										21
									
								
								README.md
									
									
									
									
									
								
							| @@ -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. | ||||
|  | ||||
|  | ||||
|   | ||||
| @@ -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; | ||||
|   } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user