使用HTML / CSS / JavaScript隐藏YouTube视频控件(标题、稍后观看、共享)

<iframe width="560" height="315" src="https://www.youtube.com/embed/视频ID" frameborder="0" allowfullscreen></iframe>

<style>
    .video-container {
        position: relative;
        width: 560px;
        height: 315px;
    }

    .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .video-container .hide-controls {
        display: none;
    }
</style>

<script>
    var videoContainer = document.querySelector('.video-container');
    var videoIframe = videoContainer.querySelector('iframe');

    videoContainer.addEventListener('mouseover', function() {
        videoIframe.setAttribute('controls', 'controls');
        videoContainer.classList.remove('hide-controls');
    });

    videoContainer.addEventListener('mouseout', function() {
        videoIframe.removeAttribute('controls');
        videoContainer.classList.add('hide-controls');
    });
</script>