# Get visible lines (with respect to current scroll)

**URL:** https://discuss.codemirror.net/t/get-visible-lines-with-respect-to-current-scroll/1429
**Category:** Uncategorized
**Created:** [December 1, 2017, 7:47am UTC](https://discuss.codemirror.net/t/get-visible-lines-with-respect-to-current-scroll/1429 "2017-12-01T07:47:38Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![grissius](https://discuss.codemirror.net/letter_avatar_proxy/v4/letter/g/278dde/32.png) [@grissius](https://discuss.codemirror.net/u/grissius)
#### Post date: [December 1, 2017, 7:47am UTC](https://discuss.codemirror.net/t/get-visible-lines-with-respect-to-current-scroll/1429/1 "2017-12-01T07:47:39Z")

</div>

Is it possible to get range of lines currently visible in the browser?

After some research I merely found method `getViewport()`, which returns, as I understand, the line range which are currently **rendered** in the DOM, but since CM generally renders several (default 10, configurable) lines before/after current visible lines, it’s not what I am trying to find.

I would like to find lines, which are **visible to the user** (I don’t care what is in DOM, I care about the lines that are visible with respect to current scroll).

I could implement the feature myself, if elements with class `CodeMirror-line` bore the information of the line number (I want the solution independent on line number gutters). If CM does not provide API for the visible lines, can I modify line rendering via a plugin to include that information?

Thank you!

---

<div class="post-metadata">

### Author: ![marijn](https://discuss.codemirror.net/user_avatar/discuss.codemirror.net/marijn/32/136_2.png) [@marijn](https://discuss.codemirror.net/u/marijn)
#### Post date: [December 1, 2017, 9:09am UTC](https://discuss.codemirror.net/t/get-visible-lines-with-respect-to-current-scroll/1429/2 "2017-12-01T09:09:09Z")

</div>

You don’t need to add information to the DOM. Do something like this:

```javascript
    var rect = editor.getWrapperElement().getBoundingClientRect();
    var topVisibleLine = editor.lineAtHeight(rect.top, "window");
    var bottomVisibleLine = editor.lineAtHeight(rect.bottom, "window");

```

---

<div class="post-metadata">

### Author: ![grissius](https://discuss.codemirror.net/letter_avatar_proxy/v4/letter/g/278dde/32.png) [@grissius](https://discuss.codemirror.net/u/grissius)
#### Post date: [December 1, 2017, 9:49am UTC](https://discuss.codemirror.net/t/get-visible-lines-with-respect-to-current-scroll/1429/3 "2017-12-01T09:49:30Z")

</div>

This is beautiful! I must have missed the `lineAtHeight` method. Thank you 😺