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:
		
							parent
							
								
									95bba5179f
								
							
						
					
					
						commit
						420b6912d7
					
				
					 2 changed files with 25 additions and 0 deletions
				
			
		
							
								
								
									
										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; | ||||
|   } | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue