Creating An AutoScroll Extension For Chrome (Updated).
Update to the Chrome extension from the article: Creating An AutoScroll Extension For Chrome.
IMPROVEMENTS:
📌 Manifest.json: Removed the "declarativeContent" permission as it is not used.
📌 background.js: Removed unnecessary code related to "onPageChanged".
📌 popup.html & popup.js: Added functionality to save and retrieve checkbox state in "chrome.storage.local".
📌 content.js: Updated auto-scroll logic to depend on the value stored in "chrome.storage.local".
Notes: You can also vary the auto-scroll logic in content.js to implement it according to your specific needs.
INSTALLATION STEPS:
1º - Create a folder where you will place the extension files. For this example "C:\scroll".
2º - Create three files that you will rename as: content.js, manifest.json, popup.html, popup.js and background.js. Remember that you must have "View file name extensions" enabled in your explorer.
3º - Copy the content of the scripts into the corresponding files.
👉 content.js
window.addEventListener('load', function() {
chrome.storage.local.get('autoScroll', function(data) {
if (data.autoScroll) {
}
});
});👉 manifest.json
{
"manifest_version": 2,
"name": "Scroll",
"version": "1.0",
"permissions": ["activeTab", "storage"],
"background": {
"scripts": ["background.js"],
"persistent": false
},
"browser_action": {
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content.js"]
}
]
}
👉 popup.html
<!DOCTYPE html> <html> <body> <h1>Extension Settings</h1> <label> <input type="checkbox" id="toggleScroll"> Activate AutoScroll </label> <script src="popup.js"></script> </body> </html>
👉 popup.js
document.getElementById('toggleScroll').addEventListener('change', function() {
chrome.storage.local.set({ autoScroll: this.checked });
});
chrome.storage.local.get('autoScroll', function(data) {
document.getElementById('toggleScroll').checked = data.autoScroll !== false;
});
👉 background.js
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([
{
conditions: [new chrome.declarativeContent.PageStateMatcher({})],
actions: [new chrome.declarativeContent.ShowPageAction()]
}
]);
});4º - Then open in the Chrome browser: Manage Extensions (chrome://extensions/).
5º - Activate Developer Mode.
6º - Go to the tab: "Load Unzipped" and open the folder where you have the extension files, in my case "C:\scroll".
7º - Ready, the extension is now installed.
8º - You can also deactivate or activate it at your convenience.
You should keep in mind that if the page is loaded dynamically (that is, if more content is added to the page after the load event is fired), the extension might not scroll to the end of the newly loaded content. This is because the load event is fired once the initial page content has loaded, but not necessarily after all dynamic content has loaded.
TOOLS, PLATFORMS & APPLICATIONS
💲 StormGain - They can start operating without investment, the capital is acquired for free with the Bitcoin Cloud Miner of the platform itself.
💲 QuantFury - Join using my Invite Code: JRRU2593 & We will both receive up to $ 250 in cryptocurrencies (BTC, ETH, etc) or an action (Uber, AAPL, etc). It is traded and invest without commissions or loan rates at spot prices in real time.
💲 Bitrefill - Living with crypto, a philosophy of financial freedom. Travel, play, eat & live with Cryptocurrencies.
💲 AddmeFast - Promote and increase the sources of traffic, visibility, reach and reputation of your social networks.
💲 Crypto Airline Game, Rich Animals - Monetized Games On Telegram.
💲 Gleev - Connect your YouTube channel and get paid. Earn up to $100 for each referral.
💲 Bulb, Publish0x - Earn cryptocurrencies, NFTs or money without investment.
💲 Solcial - Social network on the Solana blockchain that allows users to share content without censorship or fear of prohibition and also earn money for their work. Users can also own their own content and tokens.
💲 Tangled - 🎁 Pay me Internet 🎁. Generate passive income with a decentralized peer-to-peer ecosystem for consumers, advertisers, search, and social networks.
