☰

w3schools - Navigate to Next/Previous section using arrow keys!

Use the arrow keys to quickly navigate to the next or previous sections of w3schools.com tutorials ;)

  1. // ==UserScript==
  2. // @name        w3schools - Navigate to Next/Previous section using arrow keys!
  3. // @namespace   Violentmonkey Scripts
  4. // @match       https://www.w3schools.com/*/*
  5. // @grant       none
  6. // @version     1.2
  7. // @author      AvinashReddy3108 (assisted by ChatGPT)
  8. // @license     WTFPL
  9. // @description Use the arrow keys to quickly navigate to the next or previous sections of w3schools.com tutorials ;)
  10. // ==/UserScript==
  11.  
  12. (function () {
  13.     'use strict';
  14.  
  15.     document.addEventListener('keydown', function (event) {
  16.         // We don't want to bother you when you're filling a form or typing a large text
  17.         if (event.target.tagName.toLowerCase() === 'input' || event.target.tagName.toLowerCase() === 'textarea') {
  18.             return;
  19.         }
  20.  
  21.         let container = document.querySelector("div.w3-clear.nextprev");
  22.         if (!container) {
  23.             return;
  24.         }
  25.  
  26.         let prevButton = container.querySelector("a.w3-left.w3-btn");
  27.         let nextButton = container.querySelector("a.w3-right.w3-btn");
  28.  
  29.         if (event.key === 'ArrowLeft' && prevButton) {
  30.             // Prevent going away to the home page when pressing the left key at the first section.
  31.             if (prevButton.textContent.trim() !== "❮ Home") {
  32.                 window.location.href = prevButton.href;
  33.             }
  34.         } else if (event.key === 'ArrowRight' && nextButton) {
  35.             // We don't want to accidentally go into any external sites using the sneaky "Next" button.
  36.             // ex: Certification exams, etc..
  37.             let currentHost = window.location.hostname;
  38.             let nextHost = new URL(nextButton.href, window.location.href).hostname;
  39.  
  40.             if (currentHost === nextHost) {
  41.                 window.location.href = nextButton.href;
  42.             }
  43.         }
  44.     });
  45. })();