Reveal.js iframe背景

Question

我希望嵌入式iframe成为reveal.js演示文稿中的全屏(或调整后的全屏百分比)。这讨论意味着我可以将iframe设置为背景，但这将返回默认背景：

<section data-background="http://viz.healthmetricsandevaluation.org/fgh">
</section>

我也尝试过将iframe放在一个带有类扩展的div中，但它只占屏幕的一部分：

<div class = "stretch">
     <iframe width="100%" height="100%" src="http://viz.healthmetricsandevaluation.org/fgh"></iframe>
</div>

Answer 1

若要回答有关与背景交互的问题，请回答：

使用reveal.js上的dev分支获取数据背景-iframe特性。实现这个小补丁与iframes交互，直到类似的东西被合并。

function showSlide( slide ) {
    // ...

    if( background ) {
        // ...
        document.querySelector('.reveal > .backgrounds').style['z-index'] = 0;
        // ...
        if( background.hasAttribute( 'data-loaded' ) === false ) {
            // ...
            if( backgroundImage ) {
                // ...
            }
            // ...
           else if ( backgroundIframe ) {
               // ...
              document.querySelector('.reveal > .backgrounds').style['z-index'] = 1;
           }
       }
   }
}

要明确的是，增加的两行如下：

document.querySelector('.reveal > .backgrounds').style['z-index'] = 0; // reset when not in iframe
document.querySelector('.reveal > .backgrounds').style['z-index'] = 1; // set when in iframe

参考资料：https://github.com/hakimel/reveal.js/pull/1029#issuecomment-65373274

Answer 2

也许你已经搞清楚了，这似乎是最近的进步：

<section data-background-iframe="https://github.com/hakimel/reveal.js">
</section>

参考资料：https://github.com/hakimel/reveal.js/pull/1029