javascript - Page scrolls by itself when dynamically enabling CSS Anchor Positioning

When I perform the following action in a code snippet, the browser scrolls up and down on its own. I can prevent this by recording and restoring scrollY before and after the process, but what should I do to solve the fundamental problem? windows GoogleChrome 134.0.6998.89 .

Scroll to the bottom, press the last button, and then press the top button while it is still on the screen, and windows will scroll by itself.

It is also reproduced in codeSnippet on stackoverflow.

function showPopOver(e) {
  document.querySelector(".my-anchor")?.classList.remove("my-anchor");
  e.target.classList.add("my-anchor");
  document.querySelector(".my-popover").style.display = "block";
}

document.querySelectorAll("button").forEach((e, i) => {
  e.innerText = `Button-${i + 100}`;
  e.addEventListener("click", (e) => showPopOver(e));
});

* {
  word-break: break-word;
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
}

.thin-table th,
.thin-table td {
  border: 1px solid black;
  border-collapse: collapse;
}

.my-anchor {
  anchor-name: --my-anchor;
}

.my-popover {
  position-anchor: --my-anchor;
  border: solid 1px black;
  background-color: cyan;
  position: absolute;
  position-area: span-right bottom;
  position-try-fallbacks: flip-block;
}

<div class="my-popover" style="display: none">popup</div>

<table class="thin-table">
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
</table>

Scroll to the bottom, press the last button, and then press the top button while it is still on the screen, and windows will scroll by itself.

It is also reproduced in codeSnippet on stackoverflow.

function showPopOver(e) {
  document.querySelector(".my-anchor")?.classList.remove("my-anchor");
  e.target.classList.add("my-anchor");
  document.querySelector(".my-popover").style.display = "block";
}

document.querySelectorAll("button").forEach((e, i) => {
  e.innerText = `Button-${i + 100}`;
  e.addEventListener("click", (e) => showPopOver(e));
});

* {
  word-break: break-word;
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
}

.thin-table th,
.thin-table td {
  border: 1px solid black;
  border-collapse: collapse;
}

.my-anchor {
  anchor-name: --my-anchor;
}

.my-popover {
  position-anchor: --my-anchor;
  border: solid 1px black;
  background-color: cyan;
  position: absolute;
  position-area: span-right bottom;
  position-try-fallbacks: flip-block;
}

<div class="my-popover" style="display: none">popup</div>

<table class="thin-table">
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
</table>

Share edited Mar 11 at 7:54 Ori Drori 194k32 gold badges238 silver badges229 bronze badges asked Mar 11 at 3:18 Fushihara 4851 gold badge4 silver badges17 bronze badges

The scroll is caused by your my-popover because it is trying to show beside the button while on screen, so when you click the button and the div my-popover is out of the screen range, it forces to scroll. – Keyboard Corporation Commented Mar 11 at 5:14

Add a comment |

1 Answer 1

Sorted by: Reset to default 1

It seems that instead of moving the popup to the anchor element, it scrolls the anchor element to the popup.

The only solution I've found, is it hide the popup, and wait for the next frame with requestAnimationFrame, and then move the anchor and show the popup.

function showPopOver(e, label) {
  document.querySelector(".my-popover").style.display = "none";
  requestAnimationFrame(() => {
    document.querySelector(".my-anchor")?.classList.remove("my-anchor");
    e.target.classList.add("my-anchor");
    document.querySelector(".my-popover").style.display = "block";
  });
}

document.querySelectorAll("button").forEach((e, i) => {
  e.innerText = `Button-${i + 100}`;
  e.addEventListener("click", (e) => showPopOver(e));
});

* {
  word-break: break-word;
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
}

.thin-table th,
.thin-table td {
  border: 1px solid black;
  border-collapse: collapse;
}

.my-anchor {
  anchor-name: --my-anchor;
}

.my-popover {
  position-anchor: --my-anchor;
  border: solid 1px black;
  background-color: cyan;
  position: absolute;
  position-area: span-right bottom;
  position-try-fallbacks: flip-block;
}

<div class="my-popover" style="display: none">popup</div>

<table class="thin-table">
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
  <tr>
    <td>A</td>
    <td><button>B</button></td>
  </tr>
</table>

发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744815463a4595296.html

javascript - Page scrolls by itself when dynamically enabling CSS Anchor Positioning - Stack Overflow

1 Answer 1

发表回复

评论列表（0条）

联系我们

400-800-8888

javascript - Page scrolls by itself when dynamically enabling CSS Anchor Positioning - Stack Overflow

1 Answer 1

相关推荐