mirror/php-flarum
1
0
Fork 0
mirror of https://github.com/flarum/core.git synced 2025-02-25 11:43:19 +01:00
Code Issues 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 {DOMElement} element
* @param {Boolean} isInitialized * @param {Boolean} isInitialized
* @param {Object} context
*/ */
export default function affixSidebar(element, isInitialized) { export default function affixSidebar(element, isInitialized, context) {
if (isInitialized) return; if (isInitialized) return;
const $sidebar = $(element); const onresize = () => {
const $header = $('#header'); const $sidebar = $(element);
const $footer = $('#footer'); const $header = $('#header');
const $footer = $('#footer');
const $affixElement = $sidebar.find('> ul');
// Don't affix the sidebar if it is taller than the viewport (otherwise $(window).off('.affix');
// there would be no way to scroll through its content). $affixElement
if ($sidebar.outerHeight(true) > $(window).height() - $header.outerHeight(true)) return; .removeClass('affix affix-top affix-bottom')
.removeData('bs.affix');
$sidebar.find('> ul').affix({ // Don't affix the sidebar if it is taller than the viewport (otherwise
offset: { // there would be no way to scroll through its content).
top: () => $sidebar.offset().top - $header.outerHeight(true) - parseInt($sidebar.css('margin-top'), 10), if ($sidebar.outerHeight(true) > $(window).height() - $header.outerHeight(true)) return;
bottom: () => this.bottom = $footer.outerHeight(true)
} $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);
}
} }