JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 ボールを浮かせるアニメーション
PUSH TO FLOATコードエディター 本文<div class="wrapper"> <div id="stage"> <div id="shadow"></div> <div id="ball"></div> </div> <but...
JavaScript JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画面に入力した文字列の表示
入力をクリア 「画面に入力した文字列の表示」の他に「背景画像」「セキュリティ（XSS対策）」「数字の縦書き（2桁は横並び、3桁以上は縦並び）」「クリアボタン」を追加しています。コードエディター 本文 <div id="image-conta...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 二礼二拍手
二礼二拍手お賽銭を入れ、鈴を鳴らします二礼：深いお辞儀を2回繰り返します二拍手： パンパンと2回手を打ちますお祈り： 手をぴったり合わせ、感謝や願い事を伝えます一礼：最後に深く1回お辞儀をしますコードエディター 本文 <img i...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画像の回転
長押しで回転コードエディター 本文<div class="container"> <img src="ここに画像のURL" id="target-image" alt="回転画像"> <br><br> <button id="rotate-...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 時刻を読み上げる
※音声が出ます※ボリュームにご注意ください時刻を読み上げるコードエディター 本文※音声が出ます※ボリュームにご注意ください<button id="timeBtn" onclick="disableButton()">時刻を読み上げる</bu...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 時間で画像とメッセージを変える
時間帯で上の画像とメッセージが変わります コードエディター 本文<div id="container" style="padding: 50px; text-align: center; transition: 0.5s;"> <h1 id...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 ブログの画面に雨を降らせる
「雨は、世界を洗い流す銀の針。街の喧騒を遠ざけ、心を静かな場所へと連れていく。たまには傘も差さずに、空の涙を受け止める時間があってもいい。」 コードエディター 本文 <div class="content"> <p id="writin...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画像の上に舞う桜の花びら
コードエディター 本文<canvas id="sakuraCanvas"></canvas>カスタムJavaScript const canvas = document.getElementById('sakuraCanvas'); con...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画面を歩くキャラクター
コードエディター 本文 <img id="walker" src="ここに１番目の画像のURL; data-alt-src="ここに２番目の画像のURL; <script src="script.js"></script>カスタムJavaS...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 タップでキラキラ
コードエディター 本文 <canvas id="canvas"></canvas>カスタムJavaScript const handleEvent = (e) => { const clientX = e.touches ? e.touch...