What is the height of a "line" in a wheel event? (deltaMode = DOM_DELTA_LINE)

Asked
Active3 hr before
Viewed126 times

6 Answers

wheeleventheight
90%

Meta Stack Overflow , Stack Overflow help chat ,Stack Overflow en español,Stack Overflow на русском

The following asserts are always true (given that the element can be scrolled).

element.scrollTop = 0;
element.addEventListener('wheel', function(e) {
   assert(e.deltaMode === MouseEvent.DOM_DELTA_PIXEL);
   assert(element.scrollTop === e.deltaY);
});
// scroll
load more v
88%

What is the height of a "line" in a wheel event? (deltaMode = DOM_DELTA_LINE), Position of the legend in a Bokeh plot Python | 1 week ago

1.2.element.scrollTop = 0;3.element.addEventListener('wheel', function(e) {4.  assert(e.deltaMode === MouseEvent. DOM_DELTA_PIXEL);5.  assert(element.scrollTop === e.deltaY);6.});7.// scroll8.9.function getScrollLineHeight() {10.    var r;11.    var iframe = document.createElement('iframe');12.    iframe.src = '#';13.    document.body.appendChild(iframe);14.    var iwin = iframe.contentWindow;15.    var idoc = iwin.document;16.    idoc.open();17.    idoc.write('<!DOCTYPE html><html><head></head><body><span>a</span></body></html>');18.    idoc.close();19.    var span = idoc.body.firstElementChild;20.    r = span.offsetHeight;21.    document.body.removeChild(iframe);22.    return r;23.}24.25.// Get the native croll line height.26.console.log(getScrollLineHeight());27.28.nsSize29.ScrollFrameHelper::GetPageScrollAmount() const30.{31.  nsSize lineScrollAmount = GetLineScrollAmount();32.  nsSize effectiveScrollPortSize;33.  if (mIsRoot) {34.    // Reduce effective scrollport height by the height of any fixed-pos35.    // headers or footers36.    nsIFrame* root = mOuter->PresContext()->PresShell()->GetRootFrame();37.    effectiveScrollPortSize =38.      GetScrollPortSizeExcludingHeadersAndFooters(root, mScrollPort);39.  } else {40.    effectiveScrollPortSize = mScrollPort.Size();41.  }42.  // The page increment is the size of the page, minus the smaller of43.  // 10% of the size or 2 lines.44.  return nsSize(45.    effectiveScrollPortSize.width -46.      std::min(effectiveScrollPortSize.width/10, 2*lineScrollAmount.width),47.    effectiveScrollPortSize.height -48.      std::min(effectiveScrollPortSize.height/10, 2*lineScrollAmount.height));49.}50.
72%

Returns an integer representing the horizontal scroll amount.,Returns an integer representing the vertical scroll amount.,Returns a double representing the horizontal scroll amount.,Returns a double representing the vertical scroll amount.

load more v
65%

Apparently chrome use a pixel deltaMode and firefox a line deltaMode : https://bugzilla.mozilla.org/show_bug.cgi?id=1392460,It works ! However 40 is a bit much for my setup, so I investigated how to determine the LINE_HEIGHT and well: https://stackoverflow.com/questions/20110224/what-is-the-height-of-a-line-in-a-wheel-event-deltamode-dom-delta-line (on my linux laptop the getScrollLineHeight() reports 19),It's says 0 when I log event.deltaMode on Firefox. Ok I'll just rip off the link you've sent I guess ;),What's your event.deltaMode?

What's your event.deltaMode?

event.deltaMode
load more v
75%

概述:而由 DOM_DELTA_LINE 产生的滚动值可能没有由任何规范明确定义,根据以下来自 Chromium 问题跟踪器的评论和我自己的观察,似乎 Firefox 是目前唯一一个报告轮事件的浏览器,除了 deltaMode如 DOM_DELTA_PIXEL ( 0 )。 Comment来自 Chromium 问题 Implement DOM3 wheel event : ,We never set the deltaMode to anything else but DOM_DELTA_PIXEL.,关于javascript - 车轮事件中 "line"的高度是多少? (deltaMode = DOM_DELTA_LINE),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20110224/

The following asserts are always true (given that the element can be scrolled).

element.scrollTop = 0;
element.addEventListener('wheel', function(e) {
   assert(e.deltaMode === MouseEvent.DOM_DELTA_PIXEL);
   assert(element.scrollTop === e.deltaY);
});
// scroll
load more v
40%

Comentedo problema do ChromiumImplementar evento de roda DOM3:,Não estou 100% certo do que exatamente é detectado como elemento de cabeçalho e rodapé de posição fixa e o que não é, mas isso deve dar uma boa visão geral de como oDOM_DELTA_PAGEmodo também funciona, além doDOM_DELTA_LINEsobre o qual esta pergunta faz.,Se eu pudesse converter os valores de linha em valores de pixel, estaria tudo certo. Mas não consigo encontrar um fragmento de documentação sobre o que é uma "linha". Eu tentei mudar ofont-sizeeline-heightno Firefox, que não alterou o comportamento de rolagem.,DentroDOM_DELTA_PIXELmodo, o comportamento é quase pixel-perfeito. Ou seja, a proporção entre os pixels reais rolados e o valor delta de pixel relatado é quase exatamente 1, o que é demonstrado noo mesmo violino.

As afirmações a seguir são sempre verdadeiras (visto que o elemento pode ser rolado).

element.scrollTop = 0;
element.addEventListener('wheel', function(e) {
   assert(e.deltaMode === MouseEvent.DOM_DELTA_PIXEL);
   assert(element.scrollTop === e.deltaY);
});
// scroll
load more v

Other "wheel-event" queries related to "What is the height of a "line" in a wheel event? (deltaMode = DOM_DELTA_LINE)"