mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
fix bottom page exception + listen size changes too in main container
This commit is contained in:
parent
1fbda740a7
commit
2386a35eb7
@ -34,6 +34,7 @@ export default {
|
||||
header: document.querySelector("header.navigation.container"),
|
||||
bannerName: document.querySelector("#header-accompanying_course-name"),
|
||||
bannerDetails: document.querySelector("#header-accompanying_course-details"),
|
||||
container: null,
|
||||
sumBanner: null,
|
||||
stickyNav: null,
|
||||
limit: 25,
|
||||
@ -63,6 +64,7 @@ export default {
|
||||
ready() {
|
||||
|
||||
// when mounted ready
|
||||
this.container = document.querySelector("#content_conainter .container.content .container");
|
||||
this.stickyNav = document.querySelector('#navmap');
|
||||
this.sumBanner = this.header.offsetHeight + this.bannerName.offsetHeight + this.bannerDetails.offsetHeight;
|
||||
|
||||
@ -70,12 +72,11 @@ export default {
|
||||
|
||||
const resizeObserver = new ResizeObserver(entries => {
|
||||
|
||||
// Listen to header size changes,
|
||||
// then recalculate height sum and anchorsMap
|
||||
// Listen to elements resize changes, then recalculate height sum and anchorsMap
|
||||
// TODO only FF/Chrome!
|
||||
|
||||
this.sumBanner = this.header.offsetHeight + this.bannerName.offsetHeight + this.bannerDetails.offsetHeight;
|
||||
//console.log('sum', this.sumBanner);
|
||||
//console.log('calculate sum', this.sumBanner);
|
||||
|
||||
this.items = [];
|
||||
this.anchorsMap();
|
||||
@ -84,6 +85,7 @@ export default {
|
||||
resizeObserver.observe(this.header);
|
||||
resizeObserver.observe(this.bannerName);
|
||||
resizeObserver.observe(this.bannerDetails);
|
||||
resizeObserver.observe(this.container);
|
||||
|
||||
},
|
||||
anchorsMap() {
|
||||
@ -96,8 +98,7 @@ export default {
|
||||
pos: this.findPosition(anchor)['y'],
|
||||
active: false,
|
||||
key: parseInt(anchor.name.slice(8).slice(0, -1)),
|
||||
name: '#' + anchor.name,
|
||||
anchor: anchor
|
||||
name: '#' + anchor.name
|
||||
})
|
||||
});
|
||||
//console.log('items', this.items);
|
||||
@ -143,9 +144,15 @@ export default {
|
||||
let next = (this.items[i+1]) ? this.items[i+1].pos : '1000000';
|
||||
item.active =
|
||||
(window.scrollY >= item.pos & window.scrollY < next) ? true : false;
|
||||
|
||||
}, this);
|
||||
|
||||
// last item never switch active because scroll reach bottom of page
|
||||
if (document.body.scrollHeight == window.scrollY + window.innerHeight) {
|
||||
this.items[this.items.length-1].active = true;
|
||||
this.items[this.items.length-2].active = false;
|
||||
} else {
|
||||
this.items[this.items.length-1].active = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user