use scrollIntoView which is more consistent than previous strategy

This commit is contained in:
Nolan Lawson 2018-03-29 23:01:36 -07:00
parent b4fc6cf99e
commit c54bde0a19

View file

@ -75,24 +75,15 @@
} }
}, },
methods: { methods: {
scrollToPosition(rect) { scrollToPosition(element) {
if (this.get('scrolledToPosition')) { if (this.get('scrolledToPosition')) {
return return
} }
this.set({scrolledToPosition: true}) this.set({scrolledToPosition: true})
console.log('scrollToPosition', rect.top) requestAnimationFrame(() => {
let container = document.querySelector(this.get('containerQuery')) console.log('scrolling element into view')
if (!container) { element.scrollIntoView(true)
return })
}
let containerRect = container.getBoundingClientRect()
let scrollTop = rect.top - containerRect.top
if (scrollTop !== 0) {
requestAnimationFrame(() => {
console.log('setting scrollTop to ', scrollTop)
container.scrollTop = scrollTop
})
}
}, },
onIntersection(entries) { onIntersection(entries) {
mark('onIntersection') mark('onIntersection')
@ -107,7 +98,7 @@
height: rect.height height: rect.height
} }
if (scrollToItem === key) { if (scrollToItem === key) {
this.scrollToPosition(rect) this.scrollToPosition(entry.target)
} }
} }
intersectionStates = Object.assign(intersectionStates, newIntersectionStates) intersectionStates = Object.assign(intersectionStates, newIntersectionStates)