teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

質問の追加

2017/11/21 07:56

投稿

west826
west826

スコア14

title CHANGED
File without changes
body CHANGED
@@ -1,32 +1,25 @@
1
+ ###前提・実現したいこと
2
+ リアルタイムに動画の処理ができるVJの開発をしたいと考えています。
3
+ ※Firefoxを使用しています
4
+
5
+ ###発生している問題
6
+ - グレースケールボタンを押してから、セピアボタンを押すとグレースケールの設定が表示されないようにしたい。
7
+ →clearIntervalで試してみたがうまくいきませんでした
8
+ - グレースケールボタンを押してからもカラーの映像がたまに表示されてしまう
9
+ →setIntervalの秒数を変えたりしてみたが直りませんでした
10
+ - 同様に、ぼかしを押しても何も変化がありません。
11
+ →エラーが出ないので対処の仕方がわかりません
12
+
1
13
  ```html
2
14
  <!DOCTYPE html>
3
15
  <html lang="ja">
4
16
  <head>
5
17
  <meta charset="utf-8">
6
18
  <title>映像とキャンバスを同期</title>
7
-
8
-
9
- <style type="text/css">
10
- #v{
11
- display:none;
12
- }
13
- #screen{
14
- width:480px;
15
- height:270px;
16
- background-color:#000000;
17
- }
18
- button{
19
- width:100px;
20
- height:50px;
21
- }
22
- </style>
23
- </head>
19
+ </head> <body>
24
-
25
- <body>
26
20
  <video controls id="v" width="480" height="270">
27
21
  <source src="movie.mp4" width="480" height="270">
28
22
  </video>
29
-
30
23
  <div id="screen">
31
24
  <canvas id="c" width="480" height="270"></canvas>
32
25
  </div>
@@ -45,7 +38,6 @@
45
38
  <input id="color" type="color" value="#ff0000" />
46
39
  <input id="distance" type="number" value="10" />
47
40
  <button onClick="outline()">アウトライン</button>
48
-
49
41
  </body>
50
42
  </html>
51
43
  ```