# Ajout d'un en-tête dans le thème qui perturbe la barre de progression du sujet (lorsqu'il est ancré)

**URL:** <https://meta.discourse.org/t/adding-header-in-theme-messes-up-topic-progress-bar-when-docked/97393>\
**Category:** Product Support\
**Created:** [Septembre 17, 2018, 6:44 UTC](https://meta.discourse.org/t/adding-header-in-theme-messes-up-topic-progress-bar-when-docked/97393 "2018-09-17T18:44:58Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![Lew\_Grothe](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lew_grothe/32/337776_2.png) [@Lew\_Grothe](https://meta.discourse.org/u/Lew_Grothe)\
**Post date:** [Septembre 24, 2018, 7:09 UTC](https://meta.discourse.org/t/adding-header-in-theme-messes-up-topic-progress-bar-when-docked/97393/4 "2018-09-24T19:09:11Z")

</div>

So, the code in question is:

```js
  _dock() {
    const $wrapper = this.$();
    if (!$wrapper || $wrapper.length === 0) return;

    const offset = window.pageYOffset || $("html").scrollTop();
    const progressHeight = this.site.mobileView
      ? 0
      : $("#topic-progress").height();
    const maximumOffset = $("#topic-bottom").offset().top + progressHeight;
    const windowHeight = $(window).height();
    const composerHeight = $("#reply-control").height() || 0;
    const isDocked = offset >= maximumOffset - windowHeight + composerHeight;
    const bottom = $("#main").height() - maximumOffset;

    if (composerHeight > 0) {
      $wrapper.css("bottom", isDocked ? bottom : composerHeight);
    } else {
      $wrapper.css("bottom", isDocked ? bottom : "");
    }

    this.set("docked", isDocked);

    const $replyArea = $("#reply-control .reply-area");
    if ($replyArea && $replyArea.length > 0) {
      $wrapper.css("right", `${$replyArea.offset().left}px`);
    } else {
      $wrapper.css("right", "1em");
    }
  },

```

I have proven to myself that, in my case, changing

```js
   const bottom = $("#main").height() - maximumOffset;

```

to

```js
   const bottom = $("body").height() - maximumOffset;

```

works perfectly for our site.

I can imagine that you may want to not presume the **body** element selector would work in all cases so a _perhaps_ more elegant solution would be to wrap the theme (brand?) header in a **div** that could be selected such that you could replace the bottom calculation with something like:

```js
    const bottom = ((($("#brand_header").height() + $("#main").height()) - maximumOffset;

```

Suggestions? Where can we go from here?

---

_[View the full topic](https://meta.discourse.org/t/adding-header-in-theme-messes-up-topic-progress-bar-when-docked/97393)._