0

我正在研究一种广告替换脚本。有时广告会出现在这样的标签内:

<tr>
  <td align="right" width="40%"><a><img src="ad.jpg"></a></td>
  <td>123</td>
</tr>

关键是我无法更改广告的显示值;出于本练习的目的,我必须用一个不透明的 div 覆盖它,该 div 需要绝对定位以及继承边距和浮动等。

当在 div 内发现广告并且恰好向左或向右浮动时,将 div 定位在其上方,并使用适当的 left:0;或对:0;css 属性非常简单。但是,当广告由 td 设置样式时,即使 td 附加了 position:relative; ,Firefox 似乎也不能完全正确地呈现它。风格。

这是它在 Chrome\IE 中的样子:(灰色单元格是第一个 td,红色是叠加层,内部无边框单元格是要叠加的 iframe - 你看不太清楚,因为它正在被叠加:) ) 在此处输入图像描述

这是它在 Firefox 中的样子: 在此处输入图像描述

叠加层的代码非常简单......

<div style="right:0;margin-top:0px;margin-bottom:0px;margin-left:0px;margin-right:0px;padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;position:absolute;z-index:9999;background:red;width:300px;height:280px;"></div>

...并且它被添加到有问题的 td 之前。

右:0;财产使它从 td 内部一路射出,即使它被命令相对定位。

我在这里想念什么?

4

2 回答 2

1

您可以添加一个位置:相对包装器 div,如下面的小提琴:http: //jsfiddle.net/qfquj/

于 2012-06-11T01:09:31.570 回答
0

您也可以将图像设置为背景图像,而不是使用 img 标签...允许您在其中添加一个具有透明度或任何您想要的 div。

于 2014-03-06T01:53:00.207 回答