Disable links in an iFrame

I am having troubles trying to disable links in an iframe. I am trying to create a transparent div that would overlay on top of the iframe so that links do not work. Anyone willing to help?

<div id="framearea" style="border: 2px solid #000000; margin: 0px auto; width: 500px;">
<div id="framecover" style="position:absolute; z-index: 2; height: 100%; width: 100%"><img src="dot.gif" width="100%" height="100%" border="0">
<iframe id="scoreboard" scrolling="no" src="http://www.espn.com" style="border: 2px solid; margin-left: 20px; height: 400px; margin-top: -170px; width: 312px; z-index: 1"></iframe>
</div>

As I have pointed previously, Using the accepted answer in this link will do what you want to do.

But to sum things up, I will use same code in that answer and change it a little to meet your needs:

#container {
  width: 700px;
  height: 700px;
  position: relative;
}

#framearea,
#framecover {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

#framearea{
  z-index: 1;
}

#framecover {
  z-index: 10;
}

#scoreboard{
  width: 100%;
  height: 100%;
}
<div id="container">
  <div id="framearea">
    <iframe id="scoreboard" scrolling="no" src="https://www.godaddy.com"></iframe>
  </div>
  <div id="framecover">
    <img src="dot.gif" width="100%" height="100%" border="0">
  </div>
</div>
链接地址: http://www.djcxy.com/p/75866.html

上一篇: 将图标垂直居中放置在div中

下一篇: 禁用iFrame中的链接