1

有一个像下面这样的 HTML 代码：

<div class="home">
    <img id="back" src="" />
    <div class="menu">
        <ul>
            <li><a href="#">link1</a></li>
            <li><a href="#">link2</a></li>
            <li><a href="#">link3</a></li>
            <li><a href="#">link4</a></li>
            <li><a href="#">link5</a></li>
        </ul>
    </div>
    <div id="data" class="data">
       a few data that will change for every page, in fact content of each link will comes here by ajax.
    </div>
</div>

这里的所有东西在宽度和高度上都有一个像素的绝对大小，现在我想把这个 div 中的整个东西最小化 90%，所以它们的位置都不会改变。事实上，我更喜欢将整个代码放入另一个 div 中，并使其比实际大小小一点。

怎么可能？我更喜欢 CSS，但 jquery 也可以。

4

3 回答 3

1

A CSS3 approach:

.home {
  -webkit-transform: scale(.9);
  -moz-transform: scale(.9);
  transform: scale(.9);
 }

ETA: Be aware of the browser support for the transform property.

于 2013-05-30T14:57:38.947 回答
0

我猜是这样的

<script>
function resize() {
   $("div#data").height(10*$("div#data").height()/100);
}
</script>
于 2013-05-30T14:56:14.767 回答
-1

试试这个

<script>
function hideMenus() {
   $(".menu").find("ul").hide();
}
</script>
于 2013-05-30T14:48:45.040 回答