jquery - 使用 CSS 和 JQuery 控制嵌入硬编码自动播放的 iframe

Question

我在 Adob​​e Presenter 上制作了一个演示文稿，该演示文稿是使用 iframe 嵌入的。当演示文稿发布时，自动播放是硬编码的。加载页面后，演示文稿会自动开始并播放音频。

由于我无法关闭自动播放，我想添加一个播放/暂停按钮并使用 JQuery 添加一个从 display:hidden 更改为 display:block 的类显示演示文稿并在完成后隐藏它。我尝试过此操作，但即使隐藏 iframe，音频也会在页面加载时自动启动。

CSS 中是否有替代属性 display 可以完全删除元素并将其恢复，而不仅仅是隐藏它？或者有人对我如何让用户选择何时开始演示有其他想法吗？

Answer 1

您好，您可以对播放暂停按钮执行类似的操作。单击您在 .video 上替换的任何类时，它都会停止和启动视频。我不知道你为什么要 display:none 等，所以我没有将该部分包含在...如果你展开，我可以编辑我的问题，这样它很适合你。

jQuery( document ).ready(function($) {
    $('.video').click(function() {
        $(this).get(0).paused ? $(this).get(0).play() : $(this).get(0).pause();
    });
});

编辑
或者更确切地说:

jQuery(function($) {
    $('.video').on("click", function() {
        this[ this.paused ? "play" : "pause" ]();
    });
});

A pure javascript way would be

播放:

document.getElementById('videoId').play();

暂停:

document.getElementById('videoId').pause();