Tap Toggle Background

タップ/クリックで背景画像を切り替える（iPad対応）

Stellen Sie eine Frage, veröffentlichen Sie eine Bewertung oder melden Sie das Skript.

Zeilen umbrechen

// ==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';

    const urls = [
        'https://videotourl.com/images/1776643221632-ca2085be-e1f7-46d2-8a42-1470408bab73.jpeg',
        'https://videotourl.com/images/1776648965505-99e7005d-df10-4512-8384-566848a34e40.jpeg'
    ];
    let current = 0;

    // 既存の背景があれば削除
    var existing = document.getElementById('custom-bg');
    if(existing){ existing.remove(); }

    // 背景用 div 作成
    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';
    bg.style.backgroundImage = `url('${urls[current]}')`;
    bg.style.backgroundSize = 'cover';
    bg.style.backgroundRepeat = 'no-repeat';
    bg.style.backgroundPosition = 'center center';

    document.body.appendChild(bg);

    // タップ/クリックで切り替え
    function toggleBackground() {
        current = (current + 1) % urls.length;
        bg.style.backgroundImage = `url('${urls[current]}')`;
    }

    bg.addEventListener('click', toggleBackground);
    bg.addEventListener('touchstart', toggleBackground); // iPad/タッチ対応
})();