Question

移动应用的基本布局是：

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的宽度和高度来检测移动屏幕的宽度和高度，以便它适合不同版本的BlackBerry手机。 jQuery还用于检测div＃title，div＃tabs和div＃container的宽度。最后div＃container的高度是通过div＃title和div＃tabs height减去屏幕高度来计算的。

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

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

任何人都可以帮助我。我已经坚持了几个星期，真的迷路了。

谢谢。

Answer 1

试试这个 -

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

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

BlackBerry Webworks滚动超出宽度或高度

1 个答案: