github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-05-22 22:59:57 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Make sure dropdowns stay within the viewport horizontally too

Browse Source
This commit is contained in:
Toby Zerner
2015-11-20 12:34:49 +10:30
parent acf67ca416
commit 1f4e03d1fa
1 changed files with 6 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
js/lib/components/Dropdown.js
View File

@ -47,13 +47,18 @@ export default class Dropdown extends Component {
// bottom of the viewport. If it does, we will apply class to make it show // bottom of the viewport. If it does, we will apply class to make it show
// above the toggle button instead of below it. // above the toggle button instead of below it.
this.$().on('shown.bs.dropdown', () => { this.$().on('shown.bs.dropdown', () => {
const $menu = this.$('.Dropdown-menu').removeClass('Dropdown-menu--top'); const $menu = this.$('.Dropdown-menu').removeClass('Dropdown-menu--top Dropdown-menu--right');
$menu.toggleClass( $menu.toggleClass(
'Dropdown-menu--top', 'Dropdown-menu--top',
$menu.offset().top + $menu.height() > $(window).scrollTop() + $(window).height() $menu.offset().top + $menu.height() > $(window).scrollTop() + $(window).height()
); );
$menu.toggleClass(
'Dropdown-menu--right',
$menu.offset().left + $menu.width() > $(window).scrollLeft() + $(window).width()
);
if (this.props.onshow) { if (this.props.onshow) {
this.props.onshow(); this.props.onshow();
m.redraw(); m.redraw();