如何使用Javascript使div可滚动

Question

我正在研究Tizen并制作Web应用程序。

我在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";

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

Answer 1

我相信id是您将其设置为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

Answer 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';

希望对您有帮助。

Answer 3

我使用iscroll在我的移动应用程序中滚动，希望它可能对您有帮助

Answer 4

我在tizen中开发ap时遇到了类似的问题。两个轴的溢出滚动均无济于事。概率是内容处于固定位置，并且不属于可滚动分区。请检查该配合！