Wie realisiert man unter Drupal 10, dass sich ein Div beim Scrollen nach oben fixiert, wenn es 100 Pixel von oben entfernt ist?

Um ein `div` in Drupal 10 beim Scrollen zu fixieren, wenn es 100 Pixel von oben entfernt ist, kannst du JavaScript oder jQuery verwenden. Hier ist ein einfaches Beispiel, wie du dies umsetzen kannst:

1. **Füge jQuery in dein Theme ein** (falls noch nicht vorhanden). In der `your_theme.libraries.yml`-Datei:

```yaml
custom_scroll:
version: 1.x
js:
js/custom_scroll.js: {}
```

2. **Erstelle die JavaScript-Datei** `custom_scroll.js` im `js`-Verzeichnis deines Themes:

```javascript
(function ($) {
$(document).ready(function () {
var $div = $('#your-div-id'); // Ersetze 'your-div-id' mit der ID deines Divs
var offset = 100; // Offset in Pixel

$(window).scroll(function () {
if ($(this).scrollTop() > offset) {
$div.addClass('fixed'); // Füge die Klasse 'fixed' hinzu
} else {
$div.removeClass('fixed'); // Entferne die Klasse 'fixed'
}
});
});
})(jQuery);
```

3. **Füge CSS für die fixe Position hinzu**. In deiner CSS-Datei:

```css
.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%; /* oder eine andere Breite, die du benötigst */
z-index: 1000; /* Stelle sicher, dass es über anderen Inhalten liegt */
}
```

4. **Binde die Bibliothek in deinem Theme ein**. In der `your_theme.info.yml`-Datei:

```yaml
libraries:
- your_theme/custom_scroll
```

Mit diesen Schritten wird das `div` fixiert, sobald du 100 Pixel nach unten scrollst. Achte darauf, die ID des `div` und die CSS-Eigenschaften nach deinen Bedürfnissen anzupassen.