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 // initialize

View File

@@ -257,7 +257,7 @@ if ($ENABLED_DARKMODE === True) {
</a> </a>
<ul class="treeview-menu" style="display: <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('settings.php') ) ){ echo 'block'; } else {echo 'none';} ?>;"> <ul class="treeview-menu" style="display: <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('settings.php') ) ){ echo 'block'; } else {echo 'none';} ?>;">
<li> <li>
<a href="settings.php"> <?= lang("settings_enabled");?> </a> <a href="settings.php#pageTitle"> <?= lang("settings_enabled");?> </a>
</li> </li>
<li> <li>
<a href="settings.php#core_content_header"> <?= lang("settings_core_label");?> </a> <a href="settings.php#core_content_header"> <?= lang("settings_core_label");?> </a>
@@ -317,6 +317,7 @@ function workInProgress() {
//-------------------------------------------------------------- //--------------------------------------------------------------
//-------------------------------------------------------------- //--------------------------------------------------------------
function toggleFullscreen() { 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; 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> <script defer>
// ----------------------------------------------------------------------------- // -----------------------------------------------------------------------------
// handling events on the backend initiated by the front end START // handling events on the backend initiated by the front end START
// ----------------------------------------------------------------------------- // -----------------------------------------------------------------------------