Le sticky scroll dans vscode

Activez la puissante fonctionnalité Sticky Scroll de VS Code ! Gardez les lignes de contexte (comme les classes, les fonctions ou les titres de section) épinglées en haut de votre éditeur pour naviguer sans effort dans votre code et vos documents.

27 novembre 2023 · 2 minutes de lecture

Voir la source

Christophe

Amoureux de Markdown, WSL et Docker ~ Curieux insatiable.

Cet article existe aussi en anglais — lire la version originale.

Traduction automatique

Cette traduction a été produite par une IA. Elle peut contenir des contresens ou des maladresses, en particulier sur les termes techniques. En cas de doute, consultez l'article de référence en anglais — c'est lui qui fait foi.

Cet article a plus d'un an, mais il a été relu le 30 juillet 2026 — son contenu est toujours exact.

Cet article fait partie de la série VSCode — astuces, extensions et raccourcis :

Le sticky scroll dans vscode

⚡

TL;DR

Cet article présente la fonctionnalité Sticky Scroll de VSCode, qui épingle en haut de l'éditeur les lignes de contexte (nom de la classe, nom de la fonction, niveau de titre courant en Markdown, etc.) au fur et à mesure que vous défilez. Vous savez ainsi toujours où vous êtes dans le fichier. Il suffit d'ajouter "editor.stickyScroll.enabled": true dans settings.json.

https://dev.to/amrsamy/vs-code-sticky-scroll-2jcd

VS Code a récemment ajouté une nouvelle fonctionnalité vraiment utile : le sticky scroll.

Cette fonction vous permet de défiler dans un document comme un fichier Markdown, du code source écrit en PHP ou en JavaScript, ou n'importe quel autre langage supporté et, pendant le défilement, d'épingler dans la partie supérieure de l'éditeur des informations de contexte comme le nom de la classe, le nom de la fonction, le début de la boucle, etc.

Ça se marie très bien avec le folding de code : Travailler avec les regions dans VSCode vous permet de replier des blocs entiers, et le sticky scroll vous garde orienté dans ceux que vous avez laissés ouverts.

C'est vraiment très pratique. Voyez l'illustration ci-dessous (image provenant de https://dev.to/amrsamy/vs-code-sticky-scroll-2jcd)

Le sticky scroll dans vscode

Voici un exemple tiré de ce blog :

Sticky scroll en markdown

Comme vous pouvez le voir, j'ai ouvert un fichier Markdown et j'affiche une partie de l'article autour de la ligne 878. Regardez les premières lignes « collées » en haut de la fenêtre : VS Code m'affiche mon titre 1, mon titre 2 et mon titre 3, je connais donc le contexte. Les lignes affichées se situent dans le chapitre Make it easy. Plutôt sympa !

Pour activer la fonctionnalité, éditez votre fichier settings.json et ajoutez cette entrée :

"editor.stickyScroll.enabled": true

Ce fichier de configuration active la fonctionnalité de défilement collant dans l'éditeur de code. Cette feature garde visible en haut de la fenêtre les en-têtes de structure (comme les noms de fonctions ou de classes) pendant que tu fais défiler le code.

Le sticky scroll vous aide à savoir où vous êtes dans un long fichier. L'autre moitié du problème, c'est de masquer ce dont vous n'avez pas besoin dans l'immédiat, et c'est le sujet de Travailler avec les regions dans VSCode.

Cet article fait partie de la série VSCode — astuces, extensions et raccourcis :