小编van*_*owm的帖子

我正在尝试创建可拖动元素，这些元素也可以通过在 CSS 规则的帮助下拖动右下角来调整大小resize: both。到目前为止，我可以在屏幕上拖动它，但我不知道如何检测光标是否处于“调整大小”状态，因为尝试调整元素大小会移动它。

目前，作为一种解决方法，我只是检查光标是否在右下角的 20px 范围内，但这不是很准确（可能取决于浏览器/操作系统），并且在某些地方它拒绝调整元素大小或移动元素全部。

有什么建议么？

!function(){
"use strict";
let x, y, drag;
document.addEventListener("mousedown", function(e) {
  if (e.target.parentNode.lastChild !== e.target && e.target.parentNode.classList.contains("main")) {
    //bring element to the front and dispatch mousedown event again otherwise resize doesn't work
    e.target.parentNode.appendChild(e.target);
    return e.target.dispatchEvent(new MouseEvent(e.type, e));
  }

  if (!e.target.classList.contains("draggable"))
    return;

  /* if cursor within 20px from bottom right corner don't move */
  const r = e.target.getBoundingClientRect();
  if (r.right < e.x + 20 && r.bottom < e.y + 20)
    return;

  drag …

我们可以用来prefers-color-scheme: dark检测黑暗模式是否被激活：

const isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;

有没有办法检测浏览器是否支持深色模式？（“支持深色模式”是指浏览器自动更改网页的默认背景/文本颜色）。

在 CSS 中，我们可以强制使用深色模式

color-scheme: dark;

但是，某些浏览器（Android 版 Firefox）会忽略它。因此，如果黑暗模式不可用，我想隐藏主题选择。

在我的电子应用程序中，我想使用console.trace()但希望它默认折叠。为此，我在渲染器进程中使用它：

{
  const {groupCollapsed, groupEnd, trace} = console;

  console.trace = ((...args:any[]) =>
  {
    groupCollapsed(...args);
    trace("");
    groupEnd();
  }).bind(console);
}

它工作正常（有时来自异步函数的消息很少被组合在一起），但是在主进程中我被这些消息轰炸（每个trace调用生成几行）：

[34352:0406/075851.692:ERROR:CONSOLE(6)] "console.assert", source: devtools://devtools/bundled/panels/console/console.js (6)

我无法使用电子 v18.0.2 使用电子片段重现此确切消息，但它显示了类似的消息：

[5636:0406/083113.750:INFO:CONSOLE(5)] "test", source: file:///C:/Users/dev/AppData/Local/Temp/tmp-34776-vztptWEofKLe/renderer.js (5)
[5636:0406/083113.751:INFO:CONSOLE(7)] "console.groupEnd", source: file:///C:/Users/dev/AppData/Local/Temp/tmp-34776-vztptWEofKLe/renderer.js (7)

那么我如何才能看到该错误来自何处（又名devtools://devtools/bundled/panels/console/console.js），最重要的是如何抑制它？

[编辑]

这似乎与我更换无关console.trace。看来问题出在电子本身。18.0.0-alpha.5,自从这些消息出现以来，最后一个版本没有出现此问题18.0.0-beta.1。如果我清除开发人员工具控制台，消息会停止一段时间，但一段时间后，它们会开始再次显示在开发工具中的每条消息中。

我有一个管道长度列表,我需要在最大允许长度内安装这些长度,以获得最佳产量

例如,最大允许长度为90,我需要制作的部分是:

25,60,13,48,23,29,27,22

为了在90岁以内最合适,我会有一组这些数字:

60,29(共89个)

27,25,13,​​23(共88个)

48,22(共70个)

我发现这个答案类似的问题,但我不知道如何将它转换到Excel中使用或JavaScript或PHP

任何帮助,将不胜感激.

谢谢.

拖动分割器时,如何在xul窗口中调整特定节点的大小？由于xul窗口的复杂性,无法使用resizebefore/resizeafter属性.

我曾尝试ondrag在分离器上使用事件,但它根本不会发射.ondragstart事件触发很好,我可以event.offsetY用来捕获分割器移动的像素数.使用该值我可以将它添加到need元素的高度,这可以正常工作,但遗憾的是,每个拖动会话此事件仅触发一次.

有任何想法吗？

谢谢.

用它来测试它的一个例子.由于我的原始xul的复杂性,我不能改变xul结构(用户可以隐藏和更改行的顺序),所以可能只有javascript解决方案是可行的):

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="testWindow"
            title="testing resizing element by splitter"
            xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
            style="color: white;"
>
  <vbox id="resizeme" flex="1" style="background-color: yellow; color: black;">
    <hbox flex="1">
      <label value="#1"/>
      <hbox flex="1" align="center" pack="center">
        <label value="Resizable by top and bottom splitter"/>
      </hbox>
    </hbox>
  </vbox>
  <splitter tooltiptext="Top splitter"/>
  <grid flex="1">
    <columns>
        <column/>
        <column flex="1"/>
    </columns>
    <rows>
      <row style="background-color: black;">
        <label value="#2"/>
        <vbox flex="1" pack="center" align="center">
         <label value="Must stay constant size at all times"/> …

我使用网络工作者来计算用户单击按钮时元素的位置。每次点击都会产生一个新的工作人员。一旦工作人员完成其任务，它就会终止。

我注意到，有时主进程收到的新生成的工作人员的响应会有延迟（有时是一整秒，当浏览器空闲一段时间时），所以我尝试将工作人员留在内存中并重新使用它们，只是如果所有人都很忙，就会产生新的。这似乎可以解决延迟问题（平均而言，通过这种方式，第一个响应的接收速度也快了 4-6 倍），但现在我想知道，从长远来看，让工作人员留在内存中是一个好主意，特别是因为在这种情况下例如每个消耗 1.5mb RAM？

for(let i = 0; i < 100; i++)
  table.appendChild(document.createElement("div"));

const workerURL = URL.createObjectURL(new Blob(["(" + (() =>
{
  const timeNow = performance.now();
  // worker code
  const pref = {};
  this.onmessage = e => {
    Object.assign(pref, e.data);
    if (pref.status)
      this.postMessage(performance.now() - pref.time);
  }; //set preferences
  (function loop(timestamp = performance.now())
  {
    setTimeout(loop);
    if (!pref.status || timestamp - pref.time < pref.speed)
      return;

    pref.time = timestamp;
    pref.position++;
    this.postMessage(pref); //send new position
  })();
}).toString() + ")()"]));

const animations …

我有2个分支：master并mybranch 在mybranch基于一个古老的master承诺，我想移动到一个新的master承诺，而融合成master。

层次树目前看起来像这样：

master[commit1]---[commit2]---[commit3]---[commit4]
          |
          |
       mybranch[commit1]---[commit2]

我希望它是这样的：

master[commit1]---[commit2]---[commit3]---[commit4]
          |                                   |
          |                                   |
       mybranch[commit1]---[commit2]       mybranch[commit3]---[commit4]

这是 Sourcetree 的截图：