Question

祝大家愉快：）

在进入全屏模式后，我正在尝试从iframe中删除youtube品牌。您可以在此处查看我的尝试示例：https://codepen.io/emjaisthebest/pen/ZmaKGv

HTML
<p><img data-video="XqC05_Oommw" alt="Play this video" src="http://img.youtube.com/vi/Y7d42LJfkqQ/0.jpg"></p>

CSS div：fullscreen .ytp-title-text .ytp-title-link .yt-uix-sessionlink .ytp-title .ytp-title-channel-logo .ytp-title-text .ytp-watch-later-icon .ytp- button .ytp-settings-button .ytp-hd-quality-badge .ytp-title-expanded-title .ytp-youtube-button .ytp-button .yt-uix-sessionlink .ytp-menuitem-label .ytp-menuitem-内容.ytp播放按钮.ytp进度列表.ytp洗涤按钮.ytp色板背景色.ytp时间持续时间.ytp时间分隔符.ytp时间电流/ 确定您是否要隐藏当前时间，贝贝 / .ytp-share-icon .ytp-pause-overlay .ytp-related-title .ytp-pause-overlay .ytp-uggestions .ytp-expand-pause -overlay .ytp-fullscreen-button .ytp-progress-bar-padding .ytp-progress-bar .admin-bar .ytp-title-channel .ytp-title-beacon .ytp-chrome-top .ytp-show-watch -后期标题.ytp-share-button-visible .ytp-show-share-title { 显示：无！重要； }

Javascript 如果（！Element.prototype.requestFullscreen）{ Element.prototype.requestFullscreen = Element.prototype.mozRequestFullscreen || Element.prototype.webkitRequestFullscreen || Element.prototype.msRequestFullscreen; }

//听点击 document.addEventListener（'click'，function（event）{

// Check if clicked element is a video thumbnail
var videoId = event.target.getAttribute('data-video');
if (!videoId) return;

// Create iframe
var iframe = document.createElement('div');
iframe.innerHTML = '<p>x</p><iframe width="560" height="315" src="https://www.youtube.com/embed/' + videoId + '?rel=0&autoplay=1" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>';
var video = iframe.childNodes[1];

// Replace the image with the video
event.target.parentNode.replaceChild(video, event.target);

// Enter fullscreen mode
video.requestFullscreen();

}，否）；

我知道要隐藏的所有元素的css类，但是每次尝试时，它都无法正常工作。

有没有人可以帮助我删除丑陋的YouTube品牌？如果是的话，请帮助我，因为这是我的第一个网站，我真的很想让它在美学上令人愉悦。

编辑＃1：有人建议我的问题可能是在stackoverflow上找到的另一个问题的重复，但这与从iframe本身删除youtube品牌或在全屏模式下修改iframe无关。我自己尝试使用：fullscreen伪类更改它，但没有成功。有人可以告诉我我做错了吗？

Answer 1

最适合您的是class TodoApp extends React.Component { constructor(props) { super(props) this.state = { front: true } } clickHandler = () => { this.setState((prevState) => { return {front: !prevState.front}; }); } render() { alert('render called: ' + this.state.front) return ( <div className="scene scene--card" onClick={this.clickHandler}> <div className={!this.state.front ? 'card' : 'is-flipped'}> <div className="card__face card__face--front">front</div> <div className="card__face card__face--back">back</div> </div> </div> ) } } ReactDOM.render(<TodoApp />, document.querySelector("#app"))参数。例如：

modestbranding=1

您可以在此处了解更多信息：https://developers.google.com/youtube/player_parameters#modestbranding

进入全屏模式后，从嵌入式iframe中删除YouTube品牌，标题文本等

1 个答案: