Skip to content

Instantly share code, notes, and snippets.

@jDmacD
Created September 30, 2018 18:11
Show Gist options
  • Save jDmacD/87c1847ecb3f3a756784fb083a0489b0 to your computer and use it in GitHub Desktop.
Save jDmacD/87c1847ecb3f3a756784fb083a0489b0 to your computer and use it in GitHub Desktop.
javascript function to animate sticky header
updateStickyText: function() {
var t = this
if (!this.ignoreStickyTitleChange) {
var e = document.body.getBoundingClientRect()
, r = this.querySelectorAllCached(".sticky-change, .sticky-stop")
, n = document.querySelector(".sticky-stop")
, o = this.getScrollElement().scrollTop
, i = this.querySelectorCached("h1.sticky")
if (null !== i) {
var a = i.getBoundingClientRect()
, s = a.top + o
, c = a.bottom + o - s
if (null !== n) {
var u = n.querySelector("figure")
, l = u.getBoundingClientRect().top - e.top
, f = u.getBoundingClientRect().bottom - e.top
, p = f - l
, h = n.getBoundingClientRect()
, y = h.top - e.top
, d = y + p / 2 - c
if (this.textIsSticky && o < d)
return this.textIsSticky = !1,
i.classList.remove("static"),
void (i.style.top = null)
if (o > d)
return i.classList.add("static"),
this.textIsSticky = !0,
void (i.style.top = d + "px")
}
if (!this.textIsSticky) {
var v = !1
r.forEach(function(r) {
if (!v) {
var n = r.getBoundingClientRect()
, o = n.top - e.top
, i = n.bottom - e.top
r.classList.contains("sticky-change") && s > o - c && s < i && (v = !0,
t.setStickyTitle(r.dataset.stickyTitle))
}
})
}
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment