works with video, defaults to (same as for images)
This commit is contained in:
		| @@ -578,6 +578,7 @@ Automatically plays a full size video behind the slide. | |||||||
| | data-background-video        |         | A single video source, or a comma separated list of video sources. | | | data-background-video        |         | A single video source, or a comma separated list of video sources. | | ||||||
| | data-background-video-loop   | false   | Flags if the video should play repeatedly. | | | data-background-video-loop   | false   | Flags if the video should play repeatedly. | | ||||||
| | data-background-video-muted  | false   | Flags if the audio should be muted. | | | data-background-video-muted  | false   | Flags if the audio should be muted. | | ||||||
|  | | data-background-size         | cover   | Use `cover` for full screen and some cropping or `contain` for letterboxing. | | ||||||
|  |  | ||||||
| ```html | ```html | ||||||
| <section data-background-video="https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.mp4,https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.webm" data-background-video-loop data-background-video-muted> | <section data-background-video="https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.mp4,https://s3.amazonaws.com/static.slid.es/site/homepage/v1/homepage-video-editor.webm" data-background-video-loop data-background-video-muted> | ||||||
|   | |||||||
| @@ -865,7 +865,13 @@ body { | |||||||
|   max-width: none; |   max-width: none; | ||||||
|   max-height: none; |   max-height: none; | ||||||
|   top: 0; |   top: 0; | ||||||
|   left: 0; } |   left: 0; | ||||||
|  |   -o-object-fit: cover; | ||||||
|  |      object-fit: cover; } | ||||||
|  |  | ||||||
|  | .reveal .slide-background[data-background-size="contain"] video { | ||||||
|  |   -o-object-fit: contain; | ||||||
|  |      object-fit: contain; } | ||||||
|  |  | ||||||
| /* Immediate transition style */ | /* Immediate transition style */ | ||||||
| .reveal[data-background-transition=none] > .backgrounds .slide-background, | .reveal[data-background-transition=none] > .backgrounds .slide-background, | ||||||
|   | |||||||
| @@ -898,6 +898,10 @@ body { | |||||||
| 	max-height: none; | 	max-height: none; | ||||||
| 	top: 0; | 	top: 0; | ||||||
| 	left: 0; | 	left: 0; | ||||||
|  | 	object-fit: cover; | ||||||
|  | } | ||||||
|  | 	.reveal .slide-background[data-background-size="contain"] video { | ||||||
|  | 		object-fit: contain; | ||||||
| 	} | 	} | ||||||
|  |  | ||||||
| /* Immediate transition style */ | /* Immediate transition style */ | ||||||
|   | |||||||
| @@ -884,6 +884,7 @@ | |||||||
|  |  | ||||||
| 		// Additional and optional background properties | 		// Additional and optional background properties | ||||||
| 		if( data.backgroundSize ) element.style.backgroundSize = data.backgroundSize; | 		if( data.backgroundSize ) element.style.backgroundSize = data.backgroundSize; | ||||||
|  | 		if( data.backgroundSize ) element.setAttribute( 'data-background-size', data.backgroundSize ); | ||||||
| 		if( data.backgroundColor ) element.style.backgroundColor = data.backgroundColor; | 		if( data.backgroundColor ) element.style.backgroundColor = data.backgroundColor; | ||||||
| 		if( data.backgroundRepeat ) element.style.backgroundRepeat = data.backgroundRepeat; | 		if( data.backgroundRepeat ) element.style.backgroundRepeat = data.backgroundRepeat; | ||||||
| 		if( data.backgroundPosition ) element.style.backgroundPosition = data.backgroundPosition; | 		if( data.backgroundPosition ) element.style.backgroundPosition = data.backgroundPosition; | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user