problem description
the environmental background of the problems and what methods you have tried
related codes
/ / Please paste the code text below (do not replace the code with pictures)
var startPosition = 0
var curPostion = 0
var process_bar = document.querySelector("-sharpbarbg")
var process_move = document.querySelector("-sharpauto-id")
var start = 0
var prassCur = document.querySelector(".cur")
//
var listen = function(e) {
var now = ((e.clientX - start) / 493)* 100
now = now + passC
now = Math.min(now, 100)
// console.log("e.clcient", typeof(e.clientX), typeof(passC), typeof(start))
prassCur.style.width =`${now}%`
curPostion = audio.duration * now * 0.01
}
//
var dragst = function(clientx, prassCur, start) {
var now = ((clientx - start) / 493)* 100
prassCur.style.width =`${now}%`
}
//
var passCur = function() {
var prassCur = document.querySelector(".cur")
var startCur = prassCur.style.width
var startNow = startCur.slice(0, startCur.length - 1)
var startNum = (parseFloat(startNow) / 100) * 493
return parseFloat(startNow)
}
//
var dragen = function() {
var proc_now = document.querySelector(".cur")
audio.currentTime = curPostion
var prec11 = curPostion / audio.duration
console.log("prec11", prec11)
var prec1 = prec11 * 100
proc_now.style.width = `${prec1}%`
document.removeEventListener("mousemove", listen)
document.removeEventListener("mouseup", dragen)
console.log("mouseUp")
}
var passC = 0
this.isDragging = false
// var dragEvent = function () {
process_move.addEventListener("mousedown", function(e) {
e.stopPropagation()
start = e.clientX
console.log("mousedown eclienx", e.clientX)
passC = passCur()
var prassCur = document.querySelector(".cur")
document.addEventListener("mousemove", listen)
document.addEventListener("mouseup", dragen)
})
}
what result do you expect? What is the error message actually seen?
the slider can slide amicably. In fact, after sliding, the progress bar quickly bounces back to the original progress and then quickly bounces to the position to which it is moved