Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Зуев Егор
/
wiki.dev
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Commits
Issue Boards
Files
Commits
Network
Compare
Branches
Tags
Authored by
Dan Brown
2016-06-25 15:46:31 +0100
Browse Files
Options
Browse Files
Tag
Download
Email Patches
Plain Diff
Commit
361ba8b244d813d6eb56bb68be3799b7c46af539
361ba8b2
1 parent
9baa96d4
Made stick book navigation recalc on window resize
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
19 additions
and
5 deletions
resources/assets/js/pages/page-show.js
resources/assets/js/pages/page-show.js
View file @
361ba8b
...
...
@@ -74,15 +74,15 @@ window.setupPageShow = module.exports = function (pageId) {
// Make the book-tree sidebar stick in view on scroll
var
$window
=
$
(
window
);
var
$bookTree
=
$
(
".book-tree"
);
var
$bookTreeParent
=
$bookTree
.
parent
();
// Check the page is scrollable and the content is taller than the tree
var
pageScrollable
=
(
$
(
document
).
height
()
>
$window
.
height
())
&&
(
$bookTree
.
height
()
<
$
(
'.page-content'
).
height
());
// Get current tree's width and header height
var
headerHeight
=
$
(
"#header"
).
height
()
+
$
(
".toolbar"
).
height
();
var
isFixed
=
$window
.
scrollTop
()
>
headerHeight
;
var
bookTreeWidth
=
$bookTree
.
width
();
// Function to fix the tree as a sidebar
function
stickTree
()
{
$bookTree
.
width
(
bookTreeWidth
+
48
+
15
);
$bookTree
.
width
(
$bookTreeParent
.
width
()
+
15
);
$bookTree
.
addClass
(
"fixed"
);
isFixed
=
true
;
}
...
...
@@ -101,13 +101,27 @@ window.setupPageShow = module.exports = function (pageId) {
unstickTree
();
}
}
// The event ran when the window scrolls
function
windowScrollEvent
()
{
checkTreeStickiness
(
false
);
}
// If the page is scrollable and the window is wide enough listen to scroll events
// and evaluate tree stickiness.
if
(
pageScrollable
&&
$window
.
width
()
>
1000
)
{
$window
.
scroll
(
function
()
{
checkTreeStickiness
(
false
);
});
$window
.
on
(
'scroll'
,
windowScrollEvent
);
checkTreeStickiness
(
true
);
}
// Handle window resizing and switch between desktop/mobile views
$window
.
on
(
'resize'
,
event
=>
{
if
(
pageScrollable
&&
$window
.
width
()
>
1000
)
{
$window
.
on
(
'scroll'
,
windowScrollEvent
);
checkTreeStickiness
(
true
);
}
else
{
$window
.
off
(
'scroll'
,
windowScrollEvent
);
unstickTree
();
}
});
};
...
...
Please
register
or
sign in
to post a comment