如何使用 Javascript 使 div 可滚动答案

【问题标题】：How to make div Scrollable using Javascript如何使用 Javascript 使 div 可滚动
【发布时间】：2015-11-07 22:21:40
【问题描述】：

我正在开发 Tizen 并制作网络应用程序。

我在 html5 中有一个 div，并将图像设置为该 div 的背景。现在我有一些场景，我必须在这个 div 中多次显示一些随机文本。不能保证文本总是相同的大小。我的图像尺寸是 300 宽和 90 高。

现在，每当我的文本较大时，我想通过 javascript 设置我的 div 向上和向下滚动。我试过scrollTop，溢出：自动/滚动，但它不起作用。

实际上，我可以在 Eclipse 的 HTML 视图中看到结果，但是当我在设备上运行我的代码时，它没有显示任何滚动条。任何帮助将不胜感激。

这是我的代码，其中有一个名为 textView 的 div：

  <div id="textView" style="height: 90px; width: 300px;  
    margin-left: 20px; margin-top: 20px;overflow: auto;">
  </div>

在 javascript 中：

  var elem = document.getElementById("textView");

  elem.scrollTop="80px";

  elem.innerHTML="llllllllllllllllllllllllllllllllllllllllll"+'<br/>'
  +"llllllllllllllllllllllllllllllllllllllllllll"+'<br/>'
  +"llllllllllllllllllllllllllllllllllllllllllll"+'</br>'
  +"llllllllllllllllllllllllllllllllllllllllllll"+'<br/>';
  elem.style.color = "White";

  elem.style.fontSize = "50px";

我想在图像边界内显示文本，而不是超出图像边界。

【问题讨论】：

这是什么设备？例如，在 iOS 设备上，似乎没有办法强制显示滚动条。你必须用其他东西来表明它或选择不同的设计解决方案。
还有一件事...也许...developer.tizen.org/help/…

标签： javascript html tizen tizen-web-app

【解决方案1】：

我相信你应该将它设置为 overflow:scroll 来处理它。

编辑：

查看设置overflow-x:hidden和overflow-y:auto

另一个编辑：也许是这样：https://developer.tizen.org/help/index.jsp?topic=%2Forg.tizen.web.appprogramming%2Fhtml%2Fguide%2Fui_guide%2Fui_framework_scrollview.htm

【讨论】：

我也使用过它，但它在我的软件 html 视图中显示滚动，但不在设备上。我在上面的问题中提到了它
try overflow-x:none; overflow-y:auto;
我告诉你自动或滚动它在设备上不起作用
链接指向 404。
好吧，这就是适合你的互联网。公平地说，这是一个 5 岁的答案。

【解决方案2】：

试试这个：- 首先修复<div> 的高度和宽度，然后设置overflow:auto。

document.getElementById("textView").setAttribute("style","overflow:auto;height:90px;width:500px");

或者你可以试试

document.getElementById("textView").style.width='500px';

document.getElementById("textView").style.height='90px';

document.getElementById("textView").style.overflow='auto';

希望对你有帮助。

【讨论】：

【解决方案3】：

我使用iscroll在我的移动应用中滚动，希望它可以帮助你

【讨论】：

【解决方案4】：

我在 tizen 中开发 ap 时遇到了类似的问题。两个轴的溢出滚动都没有解决问题。问题是内容是固定位置的，它不属于可滚动分区。检查那个伙伴！

【讨论】：