Tag: JavaScript

  • Content-aware Infinite Scroll Loop using JavaScript

    Content-aware Infinite Scroll Loop using JavaScript

    This project came out from a key highlight of the Luna for CTFd theme, a CTFd theme trying to reproduce the atmosphere of the game Project SEKAI: Colorful Stage feat. Hatsune Miku. In order to recreate the unique and symbolic music selection interface, I went forward to write this piece of code out myself.

  • Measure per-letter dimension of text in JavaScript

    Measure per-letter dimension of text in JavaScript

    TL;DR: Create a Range, set proper start and end points up to the text node with proper offset, then use Range.getBoundingClientRect() to get the dimensions. As a part of the Lyricova Jukebox, we wanted to support inline karaoke swipe animation. With the time tags in the data, it is easy to figure out the time […]