1

我有 2 个元素要包装并取消它们的事件。一个是 iframe，另一个是对象..

   <a href="http://google.com">
<iframe src="http://pldaflix.com/video/54312" width="500" height="415" frameborder="0"></iframe>
</a>


     <a href="http://google.com">
<object height="400" width="500"><param name="allowfullscreen" value="false">
<param name="AllowScriptAccess" value="always">
<param name="movie" value="http://embed.rede.com/player/">
<param name="FlashVars" value="id=97219&&autostart=false">
<embed src="http://embed.rube" allowfullscreen="false" AllowScriptAccess="always"
flashvars="autostart=false" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" 
type="application/x-shockwave-flash" height="400" width="500" /></object>

</a>

我想用 html 或 css 覆盖他们的事件，而不是使用 javacript .. 但 javascript 选项也是一个选项..

如何使用链接事件覆盖对象和 iframe 的事件？

更新：

我想做这样的事情：

        <div id="wrapper" style="position:relative;">
        <a href="http://google.com">
        <div style="position:absolute; width:100%; height: 100%; z-index: 9999; background-color:blue;">
            <div style="position:absolute; width:100%; height: 100%; z-index: 0;">
                <iframe src="http://playflix.com/video/54312" width="500" height="415" frameborder="0"></iframe>
            </div>
            </a>
        </div>
    </div>

将 iframe 的 div 放在链接的 div 下方..

不起作用..但我认为解决方案应该沿着这些思路

另一种方法是使用 javascript 禁用点击 div

更新：

我需要一个简单的解决方案。解决方案是将 div 放在 iframe 上方

4

3 回答 3

0

假设 jQuery：

$("iframe").click(function(){
   window.location = <yourDesiredHref>;
});

同样适用于对象。

于 2012-06-20T12:41:16.090 回答
0

您可以通过将链接放在对象之前并给它一个绝对位置来使链接覆盖对象。参见小提琴例如：http: //jsfiddle.net/sveinatle/BP9xc/4/

重要的位是：

<div class="container">
    <a id="overlay" href="http://google.com"></a>
    <iframe src="http://www.example.com" width="500" height="415" frameborder="0"></iframe>
</div>

并对其进行样式设置，以便链接覆盖对象：

.container{
    position:relative; 
    border: 2px solid red;
    overflow:hidden;
}
#overlay{
    display:block; 
    position:absolute; 
    width:100%;
    height:50%;
    background-color:rgba(255,0,0,0.5);
}
于 2012-06-20T12:47:14.403 回答
0

使用 html/css 你可以尝试这样的事情：

  • 在对象下方创建一个空的 div“叠加层”
  • 使其与 iframe 和对象的组合一样高（如果您不使用任何填充/边距，则为 815 像素）
  • 使其与较大的元素一样宽（500px）
  • 定位它以便它覆盖其他元素，例如margin-top:-500px; 给它一个比其他两个元素display:block;更大的a和a z-index，以确保它在顶部
  • 在其中/周围放置一个链接，其范围与“覆盖”一样大

您也可以尝试是否可以在元素周围放置“覆盖”并将其放在顶部z-index。

于 2012-06-20T12:48:48.573 回答