ios - 设置默认“无视频源”/“无视频权限”黑色矩形的样式

Question

当提示用户在 Safari 上获得许可时，视频元素显示为带有删除线播放按钮的黑色矩形。如何更改此元素的样式？它是否有特定的 ID/类别/标签？

我使用 Quagga JS 作为条形码扫描仪。AFAIK Quagga 创建一个video元素，然后请求相机许可。最佳结果是使用 隐藏元素display:none;，但我想不出任何方法来实现这一点。一旦扫描仪获得许可，我需要该元素显示相机馈送，但在此之前它应该将屏幕涂黑或隐藏。

Answer 1

我已经通过 JavaScript 隐藏它并在 Quagga 反馈完成后显示它来修复它。请注意，纯 CSS 解决方案会更漂亮。

// Hide the preview before it's fully initialised.
    $('#videoBoundingBox').hide();
    Quagga.init({
        inputStream: {
            name: "Live",
            type: "LiveStream",
            target: document.querySelector('#videoBoundingBox')
        },
        decoder: {
            readers: [
                "code_128_reader",
                "ean_reader"
            ]
        }
    }, function (err) {
        if (err) {
            console.log(err);
            setResult(err);
            err = err.toString();
            if (err.search("NotFoundError")) {
                // No camera found. The user is probably in an office environment.
                // Redirect to previous orders or show a background image of sorts.
            } else if (err.search("NotAllowedError")) {
                // The user has blocked the permission request.
                // We should ask them again just to be sure or redirect them.
            } else {
                // Some other error.
            }


            return;
        }
        // Hide the preview before it's fully initialised.
        $('#videoBoundingBox').show();
        setResult("Initialization finished. Ready to start");
        console.log("Initialization finished. Ready to start");
        Quagga.start();
        initializeQuaggaFeedback();
    });