Automatic scroll of Instagram page, stop scrolling by hand...
/* | |
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 - loran@ralon.nl | |
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(); | |
})(); |
This comment has been minimized.
This comment has been minimized.
it does not work in chrome :( |
This comment has been minimized.
This comment has been minimized.
That's not a lot of information to go on. Please post some error messages. |
This comment has been minimized.
This comment has been minimized.
First of all Developer, this is a great script, beautifully written, works wonderfully on Firefox. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This comment has been minimized.
Thanks for the script. How do I make it work for just instagram followers.
That is
Go to https://www.instagram.com/instagram_handle
Click on 67.3k followers
And the script keeps scrolling till the end by clicking on start autoscroll.