Bookmarklets

A bookmarklet is like a tiny Add-on for your browser. You drag it into your bookmark-bar and when you click it, it does something.

If you are using Firefox and a script-blocking Add-on (NoScript, uMatrix, …) you will notice that bookmarklets do not work if scripts are disabled for the domain the website is on. This is a bug in Firefox but there is an Add-on to work arround this issue: Bookmarklets context menu.

This Add-on requiers your bookmarklets to be HTML-URL-decodable. If you are writing bookmarklets for your self, be aware that copy-n-pasting your code into a new cookie does not fully URL-encode your code. The %-sign for example stays unencoded and has to be replaced manually by %25.

Remove Sticky

Removes all sticky elements from the page.

Bookmarklet: Remove sticky (drag me into the bookmark bar)

javascript:(function(){
  let i, elements = document.querySelectorAll('body *');
  for (i = 0; i < elements.length; i++) {
    if(getComputedStyle(elements[i]).position === 'fixed'
       || getComputedStyle(elements[i]).position === 'sticky'){
      elements[i].parentNode.removeChild(elements[i]);
    }
  }
})()

Scroll Better with the Space-Bar

When scrolling with the space-bar sticky headers can be annoying as they cover up text that scrolles underneath them.

This bookmarklet removes sticky content and adds a red indicator-line that shows, where the bottom of the page was, when you pressed space to scroll.

Bookmarklet: Space-scroll (drag me into the bookmark bar)

Source

Youtube - Better Livestream-Chat in Cinema-mode

Arranges the video and the chat side by side. Currently only working with screensizes arround 1920x1080.

Bookmarklet: Better YT-Chat (drag me into the bookmark bar)

javascript:(function(){
    let video = Array.from(document.getElementsByClassName("video-stream html5-main-video"))[0];
    let chat = document.getElementById("chat");
    chat.style.position = 'fixed';
    chat.style.top = '60px';
    chat.style.right = '5px';
    chat.style.height = '754.1px';
    video.style.left = '57.889px';
})()

HTML5-Speed

Regulates the playback-speed of the video. Works on all HTML5-Videos (e.g. Youtube).

Faster

Bookmarklet: + (drag me into the bookmark bar)

javascript:(function(){
    Array.from(document.getElementsByTagName('video'))
        .forEach(vid => vid.playbackRate *= 1.25);
}())

Slower

Bookmarklet: - (drag me into the bookmark bar)

javascript:(function(){
    Array.from(document.getElementsByTagName('video'))
        .forEach(vid => vid.playbackRate *= 0.75);
}())

Reset

Bookmarklet: 0 (drag me into the bookmark bar)

0

javascript:(function(){
    Array.from(document.getElementsByTagName('video'))
        .forEach(vid => vid.playbackRate = 0);
}())

Speedread

After activating the bookmarklet one can select text on the page and it will be displayed word by word (roughly). The bookmarklet uses the “Optimal Recognition Point” for displaying the words at the right position.

Bookmarklet: speedread (drag me into the bookmark bar)

Source