SVGで長方形を描く
Scalable Vector Graphics(SVG)を用いて、「長方形」を描画するプログラムを作ります。そして、描いた「長方形」を移動させます。 (注)SVG(Scalable Vector Grap
Read MoreScalable Vector Graphics(SVG)を用いて、「長方形」を描画するプログラムを作ります。そして、描いた「長方形」を移動させます。 (注)SVG(Scalable Vector Grap
Read More時間の経過が見えるタイマーを作りました。 棒(バー)の長さが縮んでいくことで、時間経過を表現します。 以前、記事「1分タイマーの作り方」で、1分のカウントダウンタイマーをプログラミングしました
Read More高い解像度の写真を、サイトの背景画像にするプログラムを作りました。 写真を自動でクリッピングすることで、写真を縮小することなくサイトの背景画像にします。 (注)クリッピング:写真の一部を切り取ること この部分はifram
Read Moreページを開けると、1分のカウントダウンが始まる、1分タイマーを作ります。 下図は、1分タイマーのフローチャートです。 とても簡単なフローチャートです。 文章にすると、以下の手順となります。
Read Moreページ上にJavaScriptを用いて点を描画します。 ここでも、やはり、Canvasを使用します。 (注)Canvasの詳しい説明は、記事「Canvasに長方形を描く」をご参照ください。 点の描画は、以下
Read More前回記事「Canvasに長方形を描く」の続きです。 ボタン操作で、Canvas上の長方形を描画し、また、消去します。 前回のプログラム <!DOCTYPE html> <html> <hea
Read Moreページ上にJavascriptを用いて長方形を描画します。 Javascriptで長方形などの画像を描画する際、「canvas」を使用します。 canvasは、教室の黒板やスケッチブックに相当するもので、画像を描画する「
Read Moreキーボードから文字を入力するのときに、楽しい効果音が鳴るプログラム(Javascript)を作りました。 【音量注意】 大まかな手順は、以下となります。 効果音の素材作成 Audioオブジェクトの生成
Read Moreボタンをクリックすると、「ピッ」となるプログラムを作ります。 効果音を探し、加工、プログラムへの組み込み、遅延のない再生と進みます。 効果音を探す 効果音の加工 効果音をプログラムに組み込む 効果音を遅延なく再生する (
Read MoreWebアプリ(パンフォーカス計算機)を用いることで、簡単にパンフォーカス写真が撮れます。 本記事で、パンフォーカス計算機の使用方法を説明します。 Webアプリ(パンフォーカス計算機) パンフォ
Read More