0

我有以下html页面：

<body>
    <div class="hide1" style="width:1000px; height:1000px;">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td colspan="2" align="center">Heading</td>
        </tr>
        <tr>
          <td width="51%">Left1</td>
          <td width="49%">right 1 </td>
        </tr>

        <tr>
          <td>Left 2 </td>
          <td>right 2 </td>
        </tr>
    </table>
    </div>
</body>

课程hide1是：

<style>
.hide1 {
  background: url(back.png) no-repeat;
}
</style>

JQUERY 函数是：

<script>
 $(document).ready(function(){
 $("div.mover").click(function () {
 $("div.hide1").fadeTo("slow", 0.33);
 });
 });
</script>

我的问题是整个页面都消失了。但我只想淡化div的背景图片。我怎么能做到这一点？

4

2 回答 2

0

如果再添加一个仅具有背景图像的 div 并仅淡化那个 div 呢？

就像是：

<div class="wrapper">
  <div class="image">
    //FADE THIS
  </div>
  <div class="content">
    // DON'T FADE THIS
  </div>
</div>

您可以对内部 div 使用绝对定位。

于 2009-10-21T14:38:03.753 回答
0

您不能仅将 CSS 不透明度应用于元素的背景图像。

您必须有两个元素，一个包含背景图像（可以淡化），另一个包含非淡化内容。然后，您可以使用 CSS 定位将它们放在彼此之上。

当您事先不知道内容元素的高度时，这可能会变得很棘手，因为您需要使背景元素具有相同的高度；在这种情况下，您可能需要 IE6 的绝对定位和脚本备份的组合。

于 2009-10-21T14:44:52.597 回答