这是我第一次在这里发帖,因为我不想问基本问题。但是现在,我陷在一个错误中,并且真的不知道如何解决它。
const DELAY_IN_MS = 15000
const UPDATE_RATE = 100
const INDEX_LAST_PAGE = 7
const PROGRESS_BAR = document.getElementById('my-progress-bar-akram')
var slideShowTimeOut = null
var url = null
var nextPage = null
var width = 0
var currentPageNumber = 1
var progressId = null
function changeProgressBar (pctg) {
PROGRESS_BAR.style.width = pctg + '%'
}
/**
*
* @param {number} pageNumber
*/
function setPage (pageNumber) {
window.location.assign('#t'.concat(pageNumber))
}
// Progress bar
function move (mode) {
if (mode) {
clearInterval(progressId)
changeProgressBar(0)
}
var progressId = setInterval(frame, UPDATE_RATE)
function frame () {
if (width < 100) {
width = width + 100 / (DELAY_IN_MS / UPDATE_RATE)
changeProgressBar(width)
}
}
}
/**
* This is a recursive function which jumps to a next page after a delay.
* @param {Number} page The index of the page you want to jump.
*/
function slideshow (page) {
if(page){
// move()
}
// Start the loading progress
move()
if (slideShowTimeOut !== null) {
clearTimeout(slideShowTimeOut)
changeProgressBar(0)
clearInterval(progressId)
}
// Find out where we are right now
var url = window.location.href
if (!isNaN(page)) {
currentPageNumber = page
} else {
currentPageNumber = url.slice(-1)
}
slideShowTimeOut = setTimeout(function () {
// Start here
if (currentPageNumber >= INDEX_LAST_PAGE || currentPageNumber == 1) {
setPage(2)
// Currently in the impressum site. Stop the slideshow
} else if (page === 'impressum') {
clearTimeout(slideShowTimeOut)
// Between page 2 and max page number. Set next page +1
} else if (currentPageNumber >= 2 && currentPageNumber <= INDEX_LAST_PAGE) {
setPage(parseInt(currentPageNumber) + 1)
}
slideshow()
}, DELAY_IN_MS)
}
slideshow(1)
网络已经在线。您可以在此处查看:https://cjp-hamburg.de 这个想法是在一个特定时间(DELAY_IN_MS)之后从一个“幻灯片”跳到另一个。此外,我想向用户展示此超时的过程,其进度条以id“ my-progress-bar-akram”标记。
当前的问题是,该栏在调用页面时开始,但是之后不再被调用。因此它不是递归的,我也不知道为什么会这样。
希望这里有人可以帮助我!
致谢
Akram