update slide bg example presentation to include iframes and videos #1029

This commit is contained in:
Hakim El Hattab 2014-10-17 08:52:38 +02:00
parent fa88707382
commit 16f9e95d87
2 changed files with 13 additions and 5 deletions

View File

@ -2614,7 +2614,7 @@
// Iframes // Iframes
else if ( backgroundIframe ) { else if ( backgroundIframe ) {
var iframe = document.createElement( 'iframe' ); var iframe = document.createElement( 'iframe' );
iframe.setAttribute('src', backgroundIframe); iframe.setAttribute( 'src', backgroundIframe );
iframe.style.width = '100%'; iframe.style.width = '100%';
iframe.style.height = '100%'; iframe.style.height = '100%';
iframe.style.maxHeight = '100%'; iframe.style.maxHeight = '100%';

View File

@ -64,20 +64,20 @@
</section> </section>
</section> </section>
<section data-background-transition="slide" data-background="assets/image1.png" style="background: rgba(0,0,0,0.9)"> <section data-background-transition="slide" data-background="assets/image1.png">
<h2>Background image</h2> <h2>Background image</h2>
</section> </section>
<section> <section>
<section data-background-transition="slide" data-background="assets/image1.png" style="background: rgba(0,0,0,0.9)"> <section data-background-transition="slide" data-background="assets/image1.png">
<h2>Background image</h2> <h2>Background image</h2>
</section> </section>
<section data-background-transition="slide" data-background="assets/image1.png" style="background: rgba(0,0,0,0.9)"> <section data-background-transition="slide" data-background="assets/image1.png">
<h2>Background image</h2> <h2>Background image</h2>
</section> </section>
</section> </section>
<section data-background="assets/image2.png" data-background-size="100px" data-background-repeat="repeat" data-background-color="#111" style="background: rgba(0,0,0,0.9)"> <section data-background="assets/image2.png" data-background-size="100px" data-background-repeat="repeat" data-background-color="#111">
<h2>Background image</h2> <h2>Background image</h2>
<pre>data-background-size="100px" data-background-repeat="repeat" data-background-color="#111"</pre> <pre>data-background-size="100px" data-background-repeat="repeat" data-background-color="#111"</pre>
</section> </section>
@ -89,6 +89,14 @@
<h2>Same background twice (2/2)</h2> <h2>Same background twice (2/2)</h2>
</section> </section>
<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">
<h2>Video background</h2>
</section>
<section data-background-iframe="https://slides.com">
<h2>Iframe background</h2>
</section>
<section> <section>
<section data-background="#417203"> <section data-background="#417203">
<h2>Same background twice vertical (1/2)</h2> <h2>Same background twice vertical (1/2)</h2>