Replace scrolling for playlist and lyric with native scrolling
目前為
// ==UserScript==
// @name NeteaseMusic NormalScroll Replacer
// @namespace https://github.com/nondanee
// @version 0.2.1
// @description Replace scrolling for playlist and lyric with native scrolling
// @author nondanee
// @match https://music.163.com/*
// @grant none
// ==/UserScript==
(() => {
const css = `
.normal-scroll {
overflow: auto !important;
}
.normal-scroll::-webkit-scrollbar {
width: 0px;
height: 0px;
}
.normal-scroll::-webkit-scrollbar-track,
.normal-scroll::-webkit-scrollbar-thumb,
.normal-scroll::-webkit-scrollbar-thumb:hover {
background-color: rgba(0, 0, 0, 0);
}
`
const style = document.createElement('style')
style.appendChild(document.createTextNode(css))
const stopImmediatePropagation = event => event.stopImmediatePropagation()
const action = () => {
Array
.from(document.getElementsByClassName('bline'))
.forEach(scrollBar => {
const flags = {}
const thumb = scrollBar.firstElementChild
const scrollArea = scrollBar.previousElementSibling
if (!scrollArea || scrollArea.classList.contains('normal-scroll')) return
const onMouseUp = () => {
flags.sync = false
document.removeEventListener('mouseup', onMouseUp)
}
const onMouseDown = () => {
flags.sync = true
document.addEventListener('mouseup', onMouseUp)
}
const onScroll = () => {
if (flags.sync) return
const rate = scrollArea.scrollTop / (scrollArea.scrollHeight - scrollArea.clientHeight)
const scrollRange = scrollBar.clientHeight - thumb.offsetHeight
thumb.style.top = `${rate * scrollRange}px`
}
scrollArea.classList.add('normal-scroll')
scrollArea.parentNode.addEventListener('mousewheel', stopImmediatePropagation, true)
scrollArea.addEventListener('scroll', onScroll)
scrollBar.addEventListener('mousedown', onMouseDown)
})
}
const onLoad = () => {
document.head.appendChild(style)
const playBar = document.getElementsByClassName('m-playbar')[0]
const observer = new MutationObserver(action)
playBar && observer.observe(playBar, { childList: true })
action()
}
window.addEventListener('load', onLoad)
})()