「PHP」の版間の差分
削除された内容 追加された内容
→※ 未分類: 引用 『HTML/HTML5#簡単な動画の例』 2021年11月1日 (月) 06:47 |
→※ 未分類: アニメーションはPHPではなくJavaScriptで行おうという亊の説明とコード例。 |
||
68 行
;静止画のコード例
<syntaxhighlight lang="PHP">
<?php
102 行
アニメーションの表示は、PHP側で処理すると通信に負担が掛かってしまうので、JavaScript側で処理させましょう。（下記コード内部のJavaScript部分は、[[HTML/HTML5#簡単な動画の例]] からの引用です。）
;動画のコード例
<syntaxhighlight lang="PHP">
<?php
echo <<<EOM
<!DOCTYPE html>
<html lang="ja">
<head>
<title>簡単なcanvasアニメ</title>
</head>
<body>
<canvas id="canvas" width="600" height="500"></canvas>
<script>
var cvs = document.getElementById("canvas"); // canvas要素の作成
var ctx = cvs.getContext("2d"); // コンテキストの取得 // なお、以降cvsは使わない
var count = 0; // 時間を数えるためのカウンター
var dummy = function draw() { // var でメモリなど確保しないと後工程が上手く行かない。
/* 背景色 */
ctx.clearRect(0,0,600,500); // clearRect プロパティにて範囲指定で消せる
/* 描画オブジェクト */
ctx.fillStyle="#00F";// 青い四角をこれから動かす
ctx.fillRect(50 + count,30, 40, 40); // fillRectで四角を描画できる
if(count < 300){
count++; // 単なるインクリメント
} // if count の終わり
// 追加
if(count > 150){
clearInterval(kakuho);
} // if count の終わり
// 上記を追加
} // function の終わり
// 下記コードが追加された
var kakuho = setInterval(dummy,10); // setInterval の終わり // var で確保しないと clear で止まらない場合あり
</script>
</body>
</html>
EOM;
?>
</syntaxhighlight>
[[Category:PHP|*]]
| |||