malhuda/fictioneer
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 112 Wiki Activity

Add scrolled-top-top body class and script

Browse Source
This commit is contained in:
Tetrakern 2023-11-24 00:44:08 +01:00
parent 45bf775d2d
commit 6fc9a8d3af
3 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
header.php
View File

@ -64,7 +64,7 @@ if ( is_archive() || is_search() || is_404() ) {
?>
</head>
<body <?php body_class( 'site-bg' ); ?> data-post-id="<?php echo $post_id ?: -1; ?>">
<body <?php body_class( 'site-bg scrolled-to-top' ); ?> data-post-id="<?php echo $post_id ?: -1; ?>">
<?php wp_body_open(); ?>
<?php

2
js/application.min.js vendored
View File

File diff suppressed because one or more lines are too long

15
src/js/application.js
View File

@ -501,17 +501,21 @@ var /** @const {Number} */ fcn_lastScrollTop = 0;
* on the difference. Updates the stored value afterwards for the next time.
*
* @since 4.0
* @since 5.8.1 - Also checks whether the page is scrolled to the top.
*/
function fcn_scrollDirection() {
// Do not proceed if the mobile menu is open
// Get current scroll offset
const newScrollTop = window.scrollY ?? document.documentElement.scrollTop;
// Scrolled to top?
fcn_theBody.classList.toggle('scrolled-to-top', newScrollTop === 0);
// Stop if the mobile menu is open
if (fcn_theSite.classList.contains('transformed-scroll')) {
return;
}
// Get current scroll offset
const newScrollTop = window.scrollY ?? document.documentElement.scrollTop;
// Check whether the difference between old and new offset exceeds the threshold
if (Math.abs(fcn_lastScrollTop - newScrollTop) >= 5) {
fcn_theBody.classList.toggle('scrolling-down', newScrollTop > fcn_lastScrollTop);
@ -523,6 +527,9 @@ function fcn_scrollDirection() {
// Listen for window scrolling
window.addEventListener('scroll.rAF', fcn_throttle(fcn_scrollDirection, 200));
// Initialize once
fcn_scrollDirection();
// =============================================================================
// OBSERVERS
// =============================================================================