0

我有两个网页合二为一。一页是导航菜单,第二页是实际内容。

两个页面都嵌入到自己的 div 中,然后这两个 div 包含在另一个(主)中。

问题是菜单可能会不时改变其大小(它具有悬停菜单元素),并且第二页的背景作为图像重复直到页面底部。因此,当菜单的大小增加时,第二页的一部分会保持空白。

当第一页改变它的高度时,如何让页面的第二部分重新绘制背景?

任何建议的帮助将不胜感激。

更新

这是第二页css的一部分。

#servicesTextarea {min-height:229px !important; border-top:solid 3px #009ba7; background:#f2fafb url(../images/service_text_bk.gif) repeat-x right bottom;}

更新 2

这是我拥有的 div 结构

<div id="servicesStage">
<div id="servicesNav">
    <h2><a href="our_services.php">Our Services</a></h2>
            <ul>
        <li ><a href="software.php"><i>Fios</i> Software</a>
            <ul class=navigation>
                <li   ><a href="software_fios_enterprise.php"><i>Fios</i> Enterprise</a></li>
                <li   ><a href="software_fios_csa.php"><i>Fios</i> CSA</a></li>
            </ul>
        </li>


        <li ><a href="managed_services.php">Managed Services</a></li>
    </ul>
</div>

<div id="servicesTextarea">
    <div class="padding">
        <h4>Randon text</h4>
        <ul>
            <li><b><a href="software.php">Option 1</a></li>
            <li><b><a href="consulting.php">Option 2</a></li>
        </ul>
    </div>
</div>

正如我之前提到的 serviceNav div 包含一个可能会增加其大小的导航菜单,我希望 servicesTextarea 的背景得到更新。

这是我试图避免的图片 在此处输入图像描述

4

2 回答 2

1

servicesTextArea如果不将背景放在包含andservicesNav容器的另一个包装器之外,我认为您无法使用纯 CSS 获得干净的解决方案。

但是,在 javascript 中是非常简单的。

这可能会有所帮助。

于 2013-08-05T15:54:42.000 回答
1

你的意思是第二页的实际背景保持空白?您的问题有点不清楚,但如果是这样,请使用:

background: url('/path/to/image.jpg') repeat;

重复部分是关键的变化。所有这一切都会使背景图像重复填充 div 或页面,即使调整了 div 的大小。

希望有帮助

于 2013-08-05T14:28:57.157 回答