Javascript 如何隐藏/覆盖iframe的特定部分

我有一个iframe：

<iframe width='828' 
        height='465' 
        frameborder='0' 
        allowfullscreen 
        src='https://www.firedrive.com/embed/B027D40BFCD0BBC0'>
</iframe>

并希望覆盖/移除角落中的Firedrive徽标，使其不可粘贴。我怎样才能做到这一点。我已经在网上搜索了几个小时，但似乎什么都不适合我

Jsfiddle：

注意：IFRAME包含广告。徽标位于IFRAME的右上角

---

我是html的新手，请不要简单地告诉我如何解决它，请填鸭式地告诉我代码。

您必须在iframe周围添加一个容器/包装器。试试这个：

CSS

.wrapper{
    position:relative;
    z-index: 1;
    display: inline-block;
}

.hidelogo{
    position: absolute;
    width: 150px;
    height: 40px;
    background: #222;
    right: 0px;
    bottom: 6px;
    z-index:999;
    display: block;
    color: #fff;
}

HTML

<div class="wrapper">
    <div class="hidelogo"></div>
    <iframe width='828' height='465' frameborder='0' allowfullscreen src='https://www.firedrive.com/embed/B027D40BFCD0BBC0'></iframe>
</div>

您的日志被Id Blocker的Div阻止。请提供您想要的背景颜色，或者如果您想要任何其他徽标，请将其作为此Div的背景图像。

CSS HTML

标志阻止

100%工作
iFrame有一些限制，但还有另一种方法是.load（）
对于外部URL，如果您想要相同的外观，还需要添加CSS

HTML:

JS:

$（'#urlDetails'）。加载（'http://www.example.com/page.php #内容);

注意：此处将显示id=“content”中的所有可用数据，您也可以与类名一起使用

CSS（可选）

你不能在上面放置一个div并将div设置为透明（或者给它一个颜色以完全隐藏徽标）？嘿，如果你问一些问题，请给出实现和小提琴的代码细节。你能制作一个jsFiddle吗？几分钟前添加了jsFiddle..Sam，你能给我一个代码吗？我试过这个演示，但仍然可以单击Firedrive徽标。：/哦，哈哈，我意识到盒子在按钮处而不是顶部。有没有办法让它隐形而不是黑色？完美的答案，你甚至可以创建另一个div，称之为iframe top和iframe bottom，你可以覆盖任何地方
   #Blocker{
    
    position:absolute;
    z-index:10;
    right:10px;
    bottom:5px;
    height:15px;
    width:100px;
    background-color:orange;
}
#frame{
    
    height:100%;
    width:100%;
     position:absolute;
}
#Wrapper{
    height:100%;
    width:auto;
    border:solid red 2px;
}

<div id="Wrapper">

        
    <iframe id="frame" width='828' height='465' frameborder='0' allowfullscreen src='https://www.firedrive.com/embed/B027D40BFCD0BBC0'>
    
    
</iframe>
    <div id="Blocker">
        Logo Blocked 
    </div> 
</div>