0

移动应用程序的基本布局是：

html布局：

<div id="title">Title</div>
<div id="tabs">Some tabs</div>
<div id="container" x-blackberry-focusable="true">
<div id="contents" style="width: "1000px;" height: "1000px;">
<div x-blackberry-focusable="true" onmouseover="highlight(this)" onmouseout="noHighlight(this)">I am some content">
 . 
 .
 .
<div x-blackberry-focusable="true" onmouseover="highlight(this)" onmouseout="noHighlight(this)">I am some content"> 
</div>
</div>

CSS代码：

#title
{
   height: 50px;
}
#tabs
{
   height: 40px;
}
#container
{
   overflow: auto;
}

我使用jQuery设置了宽度和高度来检测手机屏幕的宽度和高度，使其适合不同版本的黑莓手机。jQuery 还用于检测 div#title、div#tabs 和 div#container 的宽度。最后，div#container 的高度是通过 div#title 和 div#tabs 高度减去屏幕高度来计算的。

div#container 中的内容总是大于 div#container 的高度或宽度。例如，在 Torch 9800 上，屏幕是 360x480 div#container 将是 360x390，那么里面的任何东西都会比 div#container 大。

即使我设置了 div#container overflow: auto，当我使用触控板或轨迹球滚动 div#container 内的内容时，即使内部容器大于 div#container，它也永远不会超过 div#container 的宽度或高度。

谁能帮帮我吗。我已经坚持了几个星期，真的很迷茫。

谢谢你。

4

1 回答 1

1

尝试这个 -

  #container{
      overflow: scroll;
      -webkit-overflow-scrolling: touch;
  }

注意：如果容器/内容具有位置属性（绝对或相对），它将无法正常工作。BB OS6 及以上版本使用 webkit。

于 2012-12-02T04:31:23.700 回答