Created
May 31, 2017 20:13
-
-
Save LoranKloeze/cf6d08fa04b5371980442f92209d045e to your computer and use it in GitHub Desktop.
Automatic scroll of Instagram page, stop scrolling by hand...
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
/* | |
Tired of scrolling to one of the last photos on the page on Instagram? Let your | |
browser do the scrolling for you! | |
31-05-2017 | |
(c) 2017 - Loran Kloeze - [email protected] | |
Usage | |
- Go to https://www.instagram.com/instagram_handle/ (change instagram_handle in i.e. taylorswift) | |
- Open up the console (F12) (Firefox users: type 'allow pasting' if you haven't done so yet) | |
- Select the contents of this complete file and copy/paste it to the console and hit enter | |
- You may close the console now | |
- A UI pops up at the left, click on the button to start scrolling | |
- If you scroll with the mouse, the autoscroll stops | |
*/ | |
(function() { | |
'use strict'; | |
var weAreScrolling = false; | |
var scrollTimer = null, btnToggle = null; | |
var instaFooter = document.querySelector('footer'); | |
function startScrolling(){ | |
weAreScrolling = true; | |
btnToggle.innerHTML = 'Stop autoscroll'; | |
btnToggle.classList.add('active'); | |
scrollTimer = window.setInterval( | |
function () { | |
instaFooter.scrollIntoView(); | |
}, 10); | |
} | |
function stopScrolling(){ | |
weAreScrolling = false; | |
if (btnToggle) { | |
btnToggle.innerHTML = 'Start autoscroll'; | |
btnToggle.classList.remove('active'); | |
} | |
if (scrollTimer) | |
clearInterval(scrollTimer); | |
} | |
// Little UI overlay | |
var style = ""; | |
style += "#lokl_guiContainer {position: fixed; width: 100px; height: 100px; top: 5px; left: 5px; background-color: rgba(255, 193, 7, 0.31); padding: 15px;"; | |
style += " font-family: -apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif; font-size: 14px; font-weight: 600; border: solid 1px rgb(255, 193, 7); border-radius: 3px;} "; | |
style += "#lokl_toggleScroll {padding: 5px 2px; border-radius: 3px; text-align: center; background-color: #35b13d; color: white;}"; | |
style += "#lokl_toggleScroll:hover {background-color: #2e9835; cursor: pointer;}"; | |
style += "#lokl_toggleScroll.active {background-color: #bb3a30; }"; | |
style += "#lokl_toggleScroll.active:hover {background-color: #a9342b; }"; | |
var styleEl = document.createElement("style"); | |
styleEl.innerHTML = style; | |
document.body.appendChild(styleEl); | |
var guiContainer = document.createElement('div'); | |
document.body.append(guiContainer); | |
guiContainer.id = 'lokl_guiContainer'; | |
btnToggle = document.createElement('a'); | |
guiContainer.append(btnToggle); | |
btnToggle.id = 'lokl_toggleScroll'; | |
btnToggle.innerHTML = 'Start autoscroll'; | |
window.addEventListener('wheel', function(e) { | |
// User starts scrolling, we stop | |
stopScrolling(); | |
}); | |
btnToggle.addEventListener('click', function(){ | |
if (weAreScrolling) { | |
stopScrolling(); | |
} else { | |
startScrolling(); | |
} | |
}); | |
// Fake click on 'Load more' or we can't scroll at all | |
document.querySelector('#react-root > section > main > article > div > a').click(); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I guess something has changed here, as I am unable to find footer division. I will see if there is something I can do then I will update the script