Tap Toggle Background のソースコード

Tap Toggle Background

タップ/クリックで背景画像を切り替える（iPad対応）
右端で折り返す
// ==UserScript==
// @name         Tap Toggle Background
// @namespace    http://tampermonkey.net/
// @version      1.2
// @description  タップ/クリックで背景画像を切り替える（iPad対応）
// @author       YourName
// @match        *://*/*
// @grant        none
// @license      MIT
// ==/UserScript==
(function() {
    'use strict';

    // Google以外では動作しない
    if (!location.hostname.includes('google.com')) return;

    const urls = [
        'https://videotourl.com/images/1776643221632-ca2085be-e1f7-46d2-8a42-1470408bab73.jpeg',
        'https://videotourl.com/images/1776730290710-0acf2cf5-6177-415b-a0ab-3bee27ddc345.webp',
        'https://videotourl.com/images/1776730296982-db547f75-c2fc-4825-aa50-38f3ea6e1e41.webp'
    ];
    let current = 0;

    var existing = document.getElementById('custom-bg');
    if(existing) existing.remove();

    // 背景（ちゃんと裏に置く）
    var bg = document.createElement('div');
    bg.id = 'custom-bg';
    bg.style.position = 'fixed';
    bg.style.top = '0';
    bg.style.left = '0';
    bg.style.width = '100vw';
    bg.style.height = '100vh';
    bg.style.zIndex = '-1'; // ←ここ重要（UIの裏）
    bg.style.backgroundImage = `url('${urls[current]}')`;
    bg.style.backgroundSize = 'cover';
    bg.style.backgroundRepeat = 'no-repeat';
    bg.style.backgroundPosition = 'center';

    document.body.appendChild(bg);

    function toggleBackground() {
        current = (current + 1) % urls.length;
        bg.style.backgroundImage = `url('${urls[current]}')`;
    }

    // 👇背景じゃなくて「ページ全体」で検知する
    document.addEventListener('touchstart', toggleBackground);
})();