Unintended vertical browser scrolling to AlphaTab element #2514
-
|
I have the following HTML code: <!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>App</title>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
</head>
<body>
<div style="height:30rem">Block with a lot of text...</div>
<div id="alphaTab">
\title "Always On The Run"
\tuning G2 D2 A1 E1
\instrument 33
\tempo 82
.
\ks G \clef bass
0.4.8 0.4.8 r.8 5.3.8 7.3.8 r.8 r.8 5.3.8 | 7.3.8 r.8 r.8 5.3.8 7.3.8 r.16 0.4.16 3.4.8 3.4.8 |
0.4.8 0.4.8 r.8 5.3.8 7.3.8 r.8 r.8 5.3.8 | 7.3.8 0.4.8 r.8 5.3.8 7.3.8 r.16 0.4.16 3.4.8 3.4.8
</div>
<div style="height:30rem">Block with a lot of text...</div>
<script type="module">
import * as alphaTab from 'https://cdn.jsdelivr.net/npm/@coderline/alphatab@latest/dist/alphaTab.min.mjs'
const element = document.getElementById('alphaTab');
const api = new alphaTab.AlphaTabApi(element, {
tex: true
});
</script>
</body>
</html>When I open the page in the browser, the browser scrolls to the first AlphaTab element. If there are multiple elements, it scrolls to the last one. How can I prevent this? |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
|
You can disable scrolling via: you could enable scrolling dynamically as the user interacts with the individual instances (e.g. when a play button is clicked). |
Beta Was this translation helpful? Give feedback.
-
|
👌 Thank you. For those who are not so familiar with the configuration. This should do the trick: const element = document.getElementById('alphaTab');
new alphaTab.AlphaTabApi(element, {
"tex": true,
"player": {
"scrollMode": "Off"
}
}); |
Beta Was this translation helpful? Give feedback.
You can disable scrolling via:
https://alphatab.net/docs/reference/settings/player/scrollmode
you could enable scrolling dynamically as the user interacts with the individual instances (e.g. when a play button is clicked).