0
0

More than 1 year has passed since last update.

お手軽に電子ドラッグ

Last updated at Posted at 2023-09-09

コード

以下をブラウザのコンソールに貼り付けて実行してください。

function getAllElements(currentWindow = window) {
    let elements = [];
    try {
        elements = [...currentWindow.document.querySelectorAll("*")];
        const iframes = currentWindow.document.querySelectorAll("iframe");
        for (const iframe of iframes) {
            elements = elements.concat(getAllElements(iframe.contentWindow));
        }
    }
    catch (e) {
        // DOMException: Blocked a frame with origin XXX from accessing a cross-origin frame.
        console.error(e);
    }
    return elements;
}

const elements = getAllElements();
elements.forEach((element) => {
    const hue = Math.floor(Math.random() * 360);
    element.style.backgroundColor = `hsl(${hue} 100% 50%)`;
    element.style.color = `hsl(${hue + 180} 100% 50%)`;
});

const body = document.querySelector("body");
let hue = 0;
body.style.filter = `invert(100%) hue-rotate(${hue}deg)`;

実行結果

スクリーンショット 2023-09-10 074545.png

チラ裏

元のコードではbodyのhueの値が1ミリ秒毎に1ずつ変化し気持ち悪さを堪能できたが、
仮にこれを公開してそれを見た人が病気になって訴えられるのも嫌なのでコードからは消した。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0