NeteaseMusic NormalScroll Replacer

Replace scrolling for playlist and lyric with native scrolling
目前为 2020-08-27 提交的版本。查看最新版本。
换行
// ==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)
})()
欢迎访问Greasy Fork镜像
