コピペするだけ！簡単「お盆の精霊馬 スピード＆到着ナビ」

皆様、お盆を楽しく過ごしていらっしゃいますか？

私は今の環境、どうも連休を取り辛く、渋々お盆休みなし。

毎年なしです。

その代わり、変な時期に1日ずつまばらに休みを取ってます。

読ませて頂いた記事をマガジンに追加させて頂いております。

伺った際にはマガジンへの登録をさせて頂いていきますが、それはやめてほしいなどありましたら、DM / コメントで一言頂けましたら幸いです😊

ブックマークに置いとくだけ！

コピペするだけの簡単小道具！

Geminiで簡単！ツール作成！

一発作成プロンプトも紹介！

季節感もなく、信心深くもなく。
お盆に何かをやったことがないのですが、せっかくなので何かお盆っぽさのある楽しいものを。

Geminiさんに相談してみました。

今日のツールはこんなものだよ！

根拠はない！

まったくない！

なんとなく気分で到着日時を計算！

ご先祖様の到着時刻！

見据えてご準備を！

🛠️ 使い方（スマホ版）

1. 適当なページをブックマークする

まずは、今見ているこのページなど、何でもいいので一度ブックマークに登録します。

2. 「編集」を開く

ブックマークバーにある今作ったブックマークを長押しして、「編集」を選択します。

3. 内容を書き換える

表示された設定画面で、以下の2箇所を変更して保存します。

• 名前：（自分が分かりやすい名前）

• URL：もともと入っているURLをすべて消して、コードを貼り付ける。

ブックマークを押すだけ簡単！

Androidをご使用の場合、以下の記事をご確認ください！

📋これを貼ります！

javascript:(function(){try{var w=window.open('about:blank','_blank');if(!w){alert('ポップアップがブロックされました。許可してください。');return;}var d=w.document;var head=d.head||d.getElementsByTagName('head')[0];if(!head){head=d.createElement('head');if(d.documentElement){d.documentElement.appendChild(head);}}var body=d.body||d.getElementsByTagName('body')[0];if(!body){body=d.createElement('body');if(d.documentElement){d.documentElement.appendChild(body);}}d.title='🍆🥒 お盆の精霊馬 スピード＆到着ナビ';var meta=d.createElement('meta');meta.name='viewport';meta.content='width=device-width,initial-scale=1.0';head.appendChild(meta);var style=d.createElement('style');style.textContent='*{box-sizing:border-box;margin:0;padding:0;}body{background:#0f172a;color:#f8fafc;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px;}.card{background:#1e293b;border:1px solid #334155;border-radius:16px;padding:24px;width:100%;max-width:750px;box-shadow:0 10px 25px -5px rgba(0,0,0,0.5);}h1{color:#38bdf8;font-size:22px;font-weight:bold;margin-bottom:6px;text-align:center;}.sub{color:#94a3b8;font-size:14px;text-align:center;margin-bottom:24px;}.group{margin-bottom:20px;}.label{display:block;font-size:14px;color:#cbd5e1;margin-bottom:8px;font-weight:600;}.btn-group{display:flex;gap:12px;}.btn{flex:1;padding:12px;border:2px solid #334155;border-radius:10px;background:#0f172a;color:#94a3b8;font-size:15px;font-weight:bold;cursor:pointer;transition:all 0.2s;}.btn.active{border-color:#38bdf8;background:#0369a1;color:#ffffff;}.select,input[type=range]{width:100%;}.select{padding:10px;border-radius:8px;border:1px solid #334155;background:#0f172a;color:#f8fafc;font-size:14px;outline:none;}.slider-val{float:right;color:#38bdf8;font-weight:bold;}.res-panel{background:#0f172a;border:1px solid #334155;border-radius:12px;padding:20px;text-align:center;margin-top:24px;}.speed-tag{display:inline-block;background:#0284c7;color:#fff;font-size:12px;padding:4px 12px;border-radius:20px;margin-bottom:12px;font-weight:bold;}.dest-label{font-size:14px;color:#94a3b8;margin-bottom:4px;}.arrival-time{font-size:32px;font-weight:bold;color:#38bdf8;margin-bottom:12px;line-height:1.2;}.info-row{font-size:14px;color:#cbd5e1;margin-bottom:12px;}.comment-box{background:#1e293b;border-left:4px solid #38bdf8;padding:12px;border-radius:0 8px 8px 0;text-align:left;font-size:13px;line-height:1.6;color:#e2e8f0;margin-top:16px;}.note{font-size:11px;color:#64748b;text-align:center;margin-top:16px;}';head.appendChild(style);var card=d.createElement('div');card.className='card';body.appendChild(card);var h1=d.createElement('h1');h1.textContent='🍆🥒 お盆の精霊馬 スピード＆到着ナビ';card.appendChild(h1);var sub=d.createElement('div');sub.className='sub';sub.textContent='「ご先祖様はいつ着く？あの世と自宅を結ぶ移動物理シミュレーション」';card.appendChild(sub);var g1=d.createElement('div');g1.className='group';var l1=d.createElement('label');l1.className='label';l1.textContent='移動手段（乗り物）';g1.appendChild(l1);var bg=d.createElement('div');bg.className='btn-group';var bCucumber=d.createElement('button');bCucumber.className='btn active';bCucumber.textContent='🥒 迎え（キュウリの馬・200km/h）';var bEggplant=d.createElement('button');bEggplant.className='btn';bEggplant.textContent='🍆 送り（ナスの牛・2km/h）';bg.appendChild(bCucumber);bg.appendChild(bEggplant);g1.appendChild(bg);card.appendChild(g1);var g2=d.createElement('div');g2.className='group';var l2=d.createElement('label');l2.className='label';l2.textContent='出発日時';g2.appendChild(l2);var sel=d.createElement('select');sel.className='select';var opts=[{t:'8月13日 16:00 (一般的な迎え火)',v:'2026-08-13T16:00'},{t:'8月13日 09:00 (フライング出発)',v:'2026-08-13T09:00'},{t:'8月16日 16:00 (一般的な送り火)',v:'2026-08-16T16:00'},{t:'8月16日 21:00 (遅めの送り火)',v:'2026-08-16T21:00'}];for(var i=0;i<opts.length;i++){var o=d.createElement('option');o.value=opts[i].v;o.textContent=opts[i].t;sel.appendChild(o);}g2.appendChild(sel);card.appendChild(g2);var g3=d.createElement('div');g3.className='group';var l3=d.createElement('label');l3.className='label';l3.appendChild(d.createTextNode('あの世（黄泉の国）からの距離: '));var sVal=d.createElement('span');sVal.className='slider-val';sVal.textContent='500 km';l3.appendChild(sVal);g3.appendChild(l3);var range=d.createElement('input');range.type='range';range.min='10';range.max='2000';range.value='500';range.step='10';g3.appendChild(range);card.appendChild(g3);var res=d.createElement('div');res.className='res-panel';var spTag=d.createElement('div');spTag.className='speed-tag';res.appendChild(spTag);var dLbl=d.createElement('div');dLbl.className='dest-label';res.appendChild(dLbl);var arrTime=d.createElement('div');arrTime.className='arrival-time';res.appendChild(arrTime);var iRow=d.createElement('div');iRow.className='info-row';res.appendChild(iRow);var cBox=d.createElement('div');cBox.className='comment-box';res.appendChild(cBox);card.appendChild(res);var note=d.createElement('div');note.className='note';note.textContent='※当ツールは「あの世から自宅までの距離」を独自に試算する娯楽シミュレーターです';card.appendChild(note);var audioCtx=null;function playBeep(){try{if(!audioCtx){var AudioContext=w.AudioContext||w.webkitAudioContext;if(AudioContext)audioCtx=new AudioContext();}if(audioCtx){if(audioCtx.state==='suspended'){audioCtx.resume();}var osc=audioCtx.createOscillator();var gain=audioCtx.createGain();osc.type='sine';osc.frequency.setValueAtTime(880,audioCtx.currentTime);gain.gain.setValueAtTime(0.05,audioCtx.currentTime);gain.gain.exponentialRampToValueAtTime(0.00001,audioCtx.currentTime+0.08);osc.connect(gain);gain.connect(audioCtx.destination);osc.start();osc.stop(audioCtx.currentTime+0.08);}}catch(e){}}var currentMode='cucumber';function calc(){var speed=currentMode==='cucumber'?200:2;var dist=parseFloat(range.value);var hours=dist/speed;var startTime=new Date(sel.value);var arrDate=new Date(startTime.getTime()+hours*3600000);spTag.textContent='想定速度: 時速 '+speed+' km/h';sVal.textContent=dist+' km';var m=arrDate.getMonth()+1;var dateNum=arrDate.getDate();var h=('0'+arrDate.getHours()).slice(-2);var min=('0'+arrDate.getMinutes()).slice(-2);var formattedArr=m+'月'+dateNum+'日 '+h+':'+min;arrTime.textContent=formattedArr;var hFloor=Math.floor(hours);var mFloor=Math.round((hours-hFloor)*60);var durText=hFloor>0?(hFloor+'時間'+mFloor+'分'):(mFloor+'分');iRow.textContent='移動距離: '+dist+' km / 所要時間: '+durText;if(currentMode==='cucumber'){dLbl.textContent='📍 自宅 到着予定日時';cBox.textContent='「早く会いたい！」という想いが乗った爆速移動です。本日夕方の迎え火でお迎えしましょう！';}else{dLbl.textContent='🌌 あの世（黄泉の国） 到着予定日時';if(m>8||(m===8&&dateNum>=20)){cBox.textContent='【悲報】到着予定が『'+m+'月'+dateNum+'日』です。お盆は完全に終わっていますが、ご先祖様が安全に旅されているなら何よりです。';}else{cBox.textContent='道中の景色を楽しみながらゆっくり安全に戻られています。心の中でお見送りしましょう。';}}}bCucumber.addEventListener('click',function(){playBeep();currentMode='cucumber';bCucumber.className='btn active';bEggplant.className='btn';calc();});bEggplant.addEventListener('click',function(){playBeep();currentMode='eggplant';bEggplant.className='btn active';bCucumber.className='btn';calc();});sel.addEventListener('change',function(){playBeep();calc();});range.addEventListener('input',function(){sVal.textContent=range.value+' km';calc();});d.addEventListener('mouseup',function(e){if(e.target===range)playBeep();});d.addEventListener('touchend',function(e){if(e.target===range)playBeep();});calc();}catch(err){console.error(err);}})();void(0);

一発作成プロンプト！

お盆の伝統行事「精霊馬（キュウリの馬・ナスの牛）」を題材に、ご先祖様があの世と自宅を往復する移動時間を大真面目に物理計算するツール「🍆🥒 お盆の精霊馬 スピード＆到着ナビ」を、新規タブ（別タブ）で起動するブックマークレットを作成してください。

一時保存や外部通信、実行元ページへのDOM追加は完全に禁止とし、完全なES5/ES6互換構文で構成してください。

【TrustedHTMLエラー回避 ＆ 新規タブ生成の絶対最厳守ルール（最重要）】
1. `document.write()`、`document.open()`、`innerHTML`、`outerHTML` 等の文字列によるHTML構築は、Trusted Typesセキュリティにより『This document requires 'TrustedHTML' assignment』エラーが発生して即死するため【完全禁止】とします。
2. 開いた新タブの `w.document` に対して、`w.document.createElement()` の純粋なDOM APIのみを用いて全UI・スタイルを構築してください。
3. 新タブ初期化時は `d.write` や `d.open` を絶対に使用せず、DOM操作で安全にhead/bodyを取得・補完してください：
   - `const d = w.document;`
   - `const head = d.head || d.getElementsByTagName('head')[0] || d.createElement('head');`
   - `const body = d.body || d.getElementsByTagName('body')[0] || d.createElement('body');`
   - `if(!d.head) d.documentElement.appendChild(head);`
   - `if(!d.body) d.documentElement.appendChild(body);`
4. JavaScriptコード内にテンプレートリテラル（バックティック ` ）や改行を含めず、【通常のシングルクォート（'）文字列結合】のみを使用し、無駄な改行のない単一の圧縮コードとして出力してください。
5. グローバルイベント（mousemove, mouseup, touchmove, touchend等）は、必ず `d.addEventListener()` または `w.document.addEventListener()`（別タブのdocument）に対して登録してください。

【精霊馬 移動物理計算 ＆ 到着日時演算モデル】
- 入力値：
  ・ 移動手段［🥒 迎え（キュウリの馬・時速200km/h） / 🍆 送り（ナスの牛・時速2km/h）］
  ・ 出発日時［8月13日 16:00 / 8月13日 09:00 / 8月16日 16:00 / 8月16日 21:00］
  ・ あの世（黄泉の国）からの距離［10km 〜 2,000km、初期値: 500km］

- 計算 ＆ 動的判定ロジック：
  1. 【所要時間】: $\text{所要時間(時間)} = \text{距離(km)} / \text{速度(km/h)}$
  2. 【到着日時】: JavaScriptの Date オブジェクトを用いて `出発日時 ＋ 所要時間` から「〇月〇日 〇〇:〇〇」を正確に算出。
  3. 【目的地ラベル ＆ 条件分岐コメント】:
     ・ キュウリ選択時：目的地ラベル「📍 自宅 到着予定日時」、一言コメント「『早く会いたい！』という想いが乗った爆速移動です。本日夕方の迎え火でお迎えしましょう！」
     ・ ナス選択時：目的地ラベル「🌌 あの世（黄泉の国） 到着予定日時」とし、到着日時がお盆期間（8月16日）を大幅に過ぎる場合（8月20日以降等）は、「【悲報】到着予定が『〇月〇日』です。お盆は完全に終わっていますが、ご先祖様が安全に旅されているなら何よりです。」と動的に書き換えること。

- 注意書き表記：
  ・ 結果表示部付近に「※当ツールは『あの世から自宅までの距離』を独自に試算する娯楽シミュレーターです」と明記すること。

【新タブ内のUIレイアウトおよび機能】
・ 全体背景: #0f172a（和モダン・しっとりダークモード）
・ 画面中央カード: #1e293b (角丸16px, 枠線 #334155, 幅最大750px)
・ タイトル: 🍆🥒 お盆の精霊馬 スピード＆到着ナビ (#38bdf8 / 22px / bold)
・ サブタイトル: 「ご先祖様はいつ着く？あの世と自宅を結ぶ移動物理シミュレーション」(#94a3b8 / 14px)
・ 入力コントロール：
  ・ 移動手段ボタン［🥒 迎え（キュウリの馬）］［🍆 送り（ナスの牛）］
  ・ 出発日時セレクトボックス
  ・ 距離スライダー（10km〜2000km）
・ メイン出力パネル:
  ・ 想定速度表示（時速 〇〇 km/h）
  ・ 到着予定日時（32px/bold/#38bdf8）
  ・ 所要時間 ＆ 条件分岐ツッコミコメント表示
・ 効果音機能: ボタンタップやスライダー操作時に Web Audio API でピピッと高音ビープ音を鳴らす。

【出力形式（絶対厳守）】
- 解説テキストや前置き文は一切出力しないでください。
- 全体を `javascript:(function(){ ... })();void(0);` のラッパー構造で記述し、単一コードブロックのみを出力してください。

この記事について！

今更ながら、Gemini 3分クッキング記事について注意点など｜へろん

PR記事を書かせて頂いています！

何でもどうぞ！答えられるものは全て答えます！

設置はお済みですか？図らずも人の庭でnote質問箱を試す！｜へろん

メンバーシップ始めました！

まだ手探りですが、ご要望/無茶振り/質問、可能な限りお受けします！

参加させて頂いています！是非チェックしてみてください😆

有料ツールに挑戦中！

OBS Studio用リモコン | OBS画面を前面に出さずに操作できます！

小道具すべて、こちらに置きました！

☕ お時間あればこちらも是非！