github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-11-25 07:38:01 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Affix sidebar when window is resized

Browse Source 
Fixes #866.
This commit is contained in:
Franz Liedke 2017-02-15 22:49:54 +01:00
parent bbcc33b5b5
commit 95c9ff9243
No known key found for this signature in database
GPG Key ID: 9A0231A879B055F4
1 changed files with 29 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
js/forum/src/utils/affixSidebar.js
View File

@ -4,22 +4,38 @@
*
* @param {DOMElement} element
* @param {Boolean} isInitialized
* @param {Object} context
*/
export default function affixSidebar(element, isInitialized) {
export default function affixSidebar(element, isInitialized, context) {
if (isInitialized) return;
const $sidebar = $(element);
const $header = $('#header');
const $footer = $('#footer');
const onresize = () => {
const $sidebar = $(element);
const $header = $('#header');
const $footer = $('#footer');
const $affixElement = $sidebar.find('> ul');
// Don't affix the sidebar if it is taller than the viewport (otherwise
// there would be no way to scroll through its content).
if ($sidebar.outerHeight(true) > $(window).height() - $header.outerHeight(true)) return;
$(window).off('.affix');
$affixElement
.removeClass('affix affix-top affix-bottom')
.removeData('bs.affix');
$sidebar.find('> ul').affix({
offset: {
top: () => $sidebar.offset().top - $header.outerHeight(true) - parseInt($sidebar.css('margin-top'), 10),
bottom: () => this.bottom = $footer.outerHeight(true)
}
});
// Don't affix the sidebar if it is taller than the viewport (otherwise
// there would be no way to scroll through its content).
if ($sidebar.outerHeight(true) > $(window).height() - $header.outerHeight(true)) return;
$affixElement.affix({
offset: {
top: () => $sidebar.offset().top - $header.outerHeight(true) - parseInt($sidebar.css('margin-top'), 10),
bottom: () => this.bottom = $footer.outerHeight(true)
}
});
};
// Register the affix plugin to execute on every window resize (and trigger)
$(window).on('resize', onresize).resize();
context.onunload = () => {
$(window).off('resize', onresize);
}
}