Scala.JS 中的粘性卷轴

Question

我正在尝试对 Scala.JS 中的这个答案做同样的事情：

根据他的例子：http://jsfiddle.net/dotnetCarpenter/KpM5j/
我试着在这里重做：https://scalafiddle.io/sf/gKgxQY0/3277

import scalatags.JsDom.all._
import scala.concurrent.duration._
import org.scalajs.dom

println(div(id := "logs", style := "height: 100px"))

js.timers.setInterval(1.millisecond) {
  val logs = dom.document.getElementById("logs")

  val isScrolledToBottom = logs.scrollHeight - logs.clientHeight <= logs.scrollTop + 1

  val child = dom.document.createElement("div")
  child.innerHTML = s"isScrolledToBottom: $isScrolledToBottom"
  logs.appendChild(child)

  if (isScrolledToBottom) logs.scrollTop = logs.scrollHeight - logs.clientHeight

  val child2 = dom.document.createElement("div")
  child2.innerHTML = s"logs.scrollTop: ${logs.scrollTop}"
  logs.appendChild(child2)
}

有人知道为什么 Scala.JS 版本不起作用吗？

干杯

Answer 1

好的，那是因为我没有在 div 上添加 overflow:auto： https://scalafiddle.io/sf/gKgxQY0/3294

import scalatags.JsDom.all._
import scala.concurrent.duration._
import org.scalajs.dom

println(div(id := "logs", style := "overflow:auto; height: 100px"))

js.timers.setInterval(1.second) {
  val logs = dom.document.getElementById("logs")

  val isScrolledToBottom =
    logs.scrollHeight - logs.clientHeight <= logs.scrollTop + 1

  val child = dom.document.createElement("div")
  child.innerHTML = s"isScrolledToBottom: $isScrolledToBottom"
  logs.appendChild(child)

  if (isScrolledToBottom)
    logs.scrollTop = logs.scrollHeight - logs.clientHeight
}

Scala.JS 中的粘性卷轴

Sticky scroll in Scala.JS

scala

scala.js