Smooth scrolling

This commit is contained in:
Jokob-sk
2024-03-05 16:17:52 +11:00
parent 8e85abfda4
commit be81668d6d
3 changed files with 40 additions and 16 deletions

View File

@@ -810,6 +810,39 @@ function updateApi()
})
}
// -----------------------------------------------------------------------------
// handling smooth scrolling
// -----------------------------------------------------------------------------
function setupSmoothScrolling() {
// Function to scroll to the element
function scrollToElement(id) {
$('html, body').animate({
scrollTop: $("#" + id).offset().top - 50
}, 500);
}
// Scroll to the element when clicking on anchor links
$('a[href*="#"]').on('click', function(event) {
var href = $(this).attr('href');
if (href && href.includes('#')) {
var id = href.substring(href.indexOf("#") + 1); // Get the ID from the href attribute
if ($("#" + id).length > 0) {
event.preventDefault(); // Prevent default anchor behavior
scrollToElement(id); // Scroll to the element
}
}
});
// Check if there's an ID in the URL and scroll to it
var url = window.location.href;
if (url.includes("#")) {
var idFromURL = url.substring(url.indexOf("#") + 1);
if ($("#" + idFromURL).length > 0) {
scrollToElement(idFromURL);
}
}
}
// -----------------------------------------------------------------------------
// initialize

View File

@@ -257,7 +257,7 @@ if ($ENABLED_DARKMODE === True) {
</a>
<ul class="treeview-menu" style="display: <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('settings.php') ) ){ echo 'block'; } else {echo 'none';} ?>;">
<li>
<a href="settings.php"> <?= lang("settings_enabled");?> </a>
<a href="settings.php#pageTitle"> <?= lang("settings_enabled");?> </a>
</li>
<li>
<a href="settings.php#core_content_header"> <?= lang("settings_core_label");?> </a>
@@ -317,6 +317,7 @@ function workInProgress() {
//--------------------------------------------------------------
//--------------------------------------------------------------
function toggleFullscreen() {

View File

@@ -517,6 +517,9 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
}
setupSmoothScrolling()
}
@@ -757,21 +760,6 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
document.getElementById('lastImportedTime').innerHTML = humanReadable;
// Scroll down if ID in URL
// Get the ID from the URL
var url = window.location.href;
var id = url.substring(url.indexOf("#") + 1);
// Check if the ID exists in the document
if ($("#" + id).length > 0) {
setTimeout(function() {
// Scroll to the element
$('html, body').animate({
scrollTop: $("#" + id).offset().top - 50
}, 1000);
},200);
}
})
@@ -784,6 +772,8 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
<script defer>
// -----------------------------------------------------------------------------
// handling events on the backend initiated by the front end START
// -----------------------------------------------------------------------------