JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画像の上に舞う桜の花びら
コードエディター 本文<canvas id="sakuraCanvas"></canvas>カスタムJavaScript const canvas = document.getElementById('sakuraCanvas'); con...
→ 画像操作
JavaScript JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画面を歩くキャラクター
コードエディター 本文 <img id="walker" src="ここに１番目の画像のURL"; data-alt-src="ここに２番目の画像のURL";> <script src="script.js"></script>カスタムJa...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 タップでキラキラ
コードエディター 本文 <canvas id="canvas"></canvas>カスタムJavaScript const handleEvent = (e) => { const clientX = e.touches ? e.touch...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 ボタンで画像の動作を制御
本坪鈴を鳴らすコードエディター 本文<div class="container"> <img src="ここに背景画像のURL" alt="背景画像" class="base-img"> <img id="target-img" class...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 画像のズームイン
コードエディター 本文<div class="zoom-container"> <img src="ここにズームする画像のURL" class="auto-zoom-in" alt="ズーム画像">カスタムJavaScriptdocumen...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 流れ星
スマホの画面で流れ星が山の向こうに消えるようにCSSで山の画像(透過PNG)を重ねるコードエディター 本文<div class="image-container" id="container> <div class="star-contai...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 クリックで画像を入れ替える
↓画像をクリックコードエディター 本文<img id="myImage" src="imageA.jpg" alt="画像A" style="cursor:pointer; width:600px;">カスタムJavaScript// 画像...
JavaScript 生成AI+スマホで作成「WordPress(ブログ)で使えるJavaScript」 波
元の画像コードエディター 本文<p><canvas id="waterCanvas"></canvas></p>カスタムJavaScriptconst canvas = document.getElementById('waterCanva...