Last active
September 1, 2022 01:01
-
-
Save ltpitt/9b2f20852bd29e94c4b67d439f7973bd to your computer and use it in GitHub Desktop.
A simple auto scroller button, can be pasted in browser console or injected in other ways in any website
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Simply copy and paste the following script in your browser's console, | |
// it will add an auto-scrolling button on the right part of the webpage you are visiting. | |
(function() { | |
let cssScrolling = "background-color: #f44336; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; float:right; position:fixed; right:0; top:50%;"; | |
let cssStopped = "background-color: #4CAF50; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; float:right; position:fixed; right:0; top:50%;"; | |
let btn = document.createElement("button"); | |
var isScrolling = false; | |
btn.innerHTML = "start scroll"; | |
btn.style.cssText = cssStopped; | |
let onclick = function() { | |
console.log("click"); | |
isScrolling = !isScrolling; | |
autoScroll() | |
}; | |
btn.addEventListener("click", onclick); | |
let autoScroll = () => { | |
if (isScrolling) { | |
window.scrollBy(0, 1); | |
btn.innerHTML = "stop scroll"; | |
btn.style.cssText = cssScrolling; | |
setTimeout(autoScroll, 10); | |
} else { | |
btn.innerHTML = "start scroll"; | |
btn.style.cssText = cssStopped; | |
} | |
}; | |
document.body.appendChild(btn); | |
})(); | |
// It is also possible to create a bookmarklet (a bookmark containing the following code) to obtain the same result | |
// just clicking on the bookmark | |
javascript: (function() {let cssScrolling = "background-color: #f44336; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; float:right; position:fixed; right:0; top:50%;"; let cssStopped = "background-color: #4CAF50; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; float:right; position:fixed; right:0; top:50%;"; let btn = document.createElement("button"); var isScrolling = false; btn.innerHTML = "start scroll"; btn.style.cssText = cssStopped; let onclick = function() {console.log("click"); isScrolling = !isScrolling; autoScroll() }; btn.addEventListener("click", onclick); let autoScroll = () => {if (isScrolling) {window.scrollBy(0, 1); btn.innerHTML = "stop scroll"; btn.style.cssText = cssScrolling; setTimeout(autoScroll, 10); } else {btn.innerHTML = "start scroll"; btn.style.cssText = cssStopped; } }; document.body.appendChild(btn); })(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment