teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問google chrome の上画面の「←」ボタンを押してキャラクタを移動したい

編集履歴

質問編集履歴

8

表題の変更

2018/06/25 06:17

投稿

uepon
uepon

スコア17

title CHANGED
@@ -1,1 +1,1 @@
1
- google chrome の「←」ボタンを押してキャラクタを移動したい
1
+ google chrome の上画面の「←」ボタンを押してキャラクタを移動したい
body CHANGED
File without changes

7

表題の変更

2018/06/25 06:17

投稿

uepon
uepon

スコア17

title CHANGED
@@ -1,1 +1,1 @@
1
- google chrome のdocument.getElementByIdを取得したい
1
+ google chrome の「←」ボタンを押してキャラクタを移動したい
body CHANGED
File without changes

6

HTMLの追加

2018/06/25 06:16

投稿

uepon
uepon

スコア17

title CHANGED
File without changes
body CHANGED
@@ -319,6 +319,9 @@
319
319
  コード
320
320
  ```
321
321
 
322
+ すみません、HTMLも追加したかったのですが、文字数制限でダメだったので、URLを追記します。
323
+ http://up-denshi.candypop.jp/11/rpg8.cgi
324
+
322
325
  上記ボタンダウンで、つまづいております。
323
326
  ボタンを押した時に、上手くいかず困っています。
324
- よろしくお願いいたします。
327
+ 何位とぞ、よろしくお願いいたします。

5

コードの修正

2018/06/25 06:04

投稿

uepon
uepon

スコア17

title CHANGED
File without changes
body CHANGED
@@ -319,4 +319,6 @@
319
319
  コード
320
320
  ```
321
321
 
322
- 上記ボタンダウンで、つまづいております。
322
+ 上記ボタンダウンで、つまづいております。
323
+ ボタンを押した時に、上手くいかず困っています。
324
+ よろしくお願いいたします。

4

コードの変更

2018/06/25 05:50

投稿

uepon
uepon

スコア17

title CHANGED
File without changes
body CHANGED
@@ -3,90 +3,6 @@
3
3
  google chrome のdocument.getElementByIdを取得したいのですが、
4
4
  ご教授願えないでしょうか？
5
5
 
6
- ```ここに言語を入力
7
- function DomToolkit()
8
- {
9
- if(document.all) {
10
- // IE
11
- Layer.prototype.setVisibility = function(f) {
12
- this.div.style.visibility = (f ? "visible" : "hidden");
13
- };
14
- Layer.prototype.getX = function() {
15
- return this.div.style.pixelLeft;
16
- };
17
- Layer.prototype.getY = function() {
18
- return this.div.style.pixelTop;
19
- };
20
- Layer.prototype.moveTo = function(x, y) {
21
- this.div.style.pixelLeft = x;
22
- this.div.style.pixelTop = y;
23
- };
24
- Layer.prototype.moveBy = function(dx, dy) {
25
- this.div.style.pixelLeft += dx;
26
- this.div.style.pixelTop += dy;
27
- };
28
-
29
- this.getLayer = function(id) {
30
- return new Layer(document.all[id]);
31
- };
32
- }
33
- else if(document.getElementById) {
34
- // Mozilla chrome
35
- Layer.prototype.setVisibility = function(f) {
36
- this.div.style.visibility = (f ? "visible" : "hidden");
37
- };
38
- Layer.prototype.getX = function() {
39
- return parseInt(this.div.style.left);
40
- };
41
- Layer.prototype.getY = function() {
42
- return parseInt(this.div.style.top);
43
- };
44
- Layer.prototype.moveTo = function(x, y) {
45
- this.div.style.left = x;
46
- this.div.style.top = y;
47
- };
48
- Layer.prototype.moveBy = function(dx, dy) {
49
- this.div.style.left = parseInt(this.div.style.left) + dx;
50
- this.div.style.top = parseInt(this.div.style.top) + dy;
51
-
52
- };
53
-
54
- this.getLayer = function(id) {
55
- return new Layer(document.getElementById(id));
56
- };
57
- }
58
- else {
59
- // NN4
60
- Layer.prototype.setVisibility = function(f) {
61
- this.div.visibility = (f ? "show" : "hide");
62
- };
63
- Layer.prototype.getX = function() {
64
- return this.div.left;
65
- };
66
- Layer.prototype.getY = function() {
67
- return this.div.top;
68
- };
69
- Layer.prototype.moveTo = function(x, y) {
70
- this.div.moveTo(x, y);
71
- };
72
- Layer.prototype.moveBy = function(dx, dy) {
73
- this.div.moveBy(dx, dy);
74
- };
75
-
76
- this.getLayer = function(id) {
77
- var i = arguments.length - 1;
78
- var layer = document.layers[arguments[i--]];
79
- while(i >= 0 && layer) {
80
- layer = layer.layers[arguments[i--]];
81
- }
82
- return new Layer(layer);
83
- };
84
- }
85
- }
86
-
87
- ```
88
- 何卒よろしくお願いします。
89
-
90
6
  全コードを書きます。
91
7
  ```
92
8
  function DomToolkit()
@@ -399,36 +315,8 @@
399
315
  }
400
316
 
401
317
 
402
- function OnButtonClick1() {
403
318
 
404
- if(CilckFlag1==1){
405
- target = document.getElementById("output1");
406
- target.innerHTML = "クリックされました！！";
407
- CilckFlag1=0;
408
- }else if(CilckFlag1==0){
409
- target = document.getElementById("output1");
410
- target.innerHTML = "クリックさてません。。。";
411
- CilckFlag1=1;
412
- }
413
- }
414
-
415
319
  コード
416
320
  ```
417
321
 
418
- 今、ボタンをクリックしても状態が変わらず、つまづいています。
419
- ```ここに言語を入力
420
- else if(document.getElementById) {
421
- // Mozilla
422
- document.addEventListener("keypress", handleKeypress, true);
423
-
424
- with(parent.input) {
425
- document.cursor.left.addEventListener("mousedown", handleMouseDown, true);
426
- document.cursor.right.addEventListener("mousedown", handleMouseDown, true);
427
- document.cursor.up.addEventListener("mousedown", handleMouseDown, true);
428
- document.cursor.down.addEventListener("mousedown", handleMouseDown, true);
429
- document.addEventListener("mouseup", handleMouseUp, false);
430
- }
431
- }
432
- ```
433
-
434
322
  上記ボタンダウンで、つまづいております。

3

コードの修正

2018/06/25 05:43

投稿

uepon
uepon

スコア17

title CHANGED
File without changes
body CHANGED
@@ -88,7 +88,8 @@
88
88
  何卒よろしくお願いします。
89
89
 
90
90
  全コードを書きます。
91
+ ```
91
- ```function DomToolkit()
92
+ function DomToolkit()
92
93
  {
93
94
  if(document.all) {
94
95
  // IE

2

コードの追加

2018/06/25 05:40

投稿

uepon
uepon

スコア17

title CHANGED
File without changes
body CHANGED
@@ -414,4 +414,20 @@
414
414
  コード
415
415
  ```
416
416
 
417
- 今、ボタンをクリックしても状態が変わらず、つまづいています。
417
+ 今、ボタンをクリックしても状態が変わらず、つまづいています。
418
+ ```ここに言語を入力
419
+ else if(document.getElementById) {
420
+ // Mozilla
421
+ document.addEventListener("keypress", handleKeypress, true);
422
+
423
+ with(parent.input) {
424
+ document.cursor.left.addEventListener("mousedown", handleMouseDown, true);
425
+ document.cursor.right.addEventListener("mousedown", handleMouseDown, true);
426
+ document.cursor.up.addEventListener("mousedown", handleMouseDown, true);
427
+ document.cursor.down.addEventListener("mousedown", handleMouseDown, true);
428
+ document.addEventListener("mouseup", handleMouseUp, false);
429
+ }
430
+ }
431
+ ```
432
+
433
+ 上記ボタンダウンで、つまづいております。

1

コードの追加

2018/06/25 05:38

投稿

uepon
uepon

スコア17

title CHANGED
File without changes
body CHANGED
@@ -85,4 +85,333 @@
85
85
  }
86
86
 
87
87
  ```
88
- 何卒よろしくお願いします。
88
+ 何卒よろしくお願いします。
89
+
90
+ 全コードを書きます。
91
+ ```function DomToolkit()
92
+ {
93
+ if(document.all) {
94
+ // IE
95
+ Layer.prototype.setVisibility = function(f) {
96
+ this.div.style.visibility = (f ? "visible" : "hidden");
97
+ };
98
+ Layer.prototype.getX = function() {
99
+ return this.div.style.pixelLeft;
100
+ };
101
+ Layer.prototype.getY = function() {
102
+ return this.div.style.pixelTop;
103
+ };
104
+ Layer.prototype.moveTo = function(x, y) {
105
+ this.div.style.pixelLeft = x;
106
+ this.div.style.pixelTop = y;
107
+ };
108
+ Layer.prototype.moveBy = function(dx, dy) {
109
+ this.div.style.pixelLeft += dx;
110
+ this.div.style.pixelTop += dy;
111
+ };
112
+
113
+ this.getLayer = function(id) {
114
+ return new Layer(document.all[id]);
115
+ };
116
+ }
117
+ else if(document.getElementById) {
118
+ // Mozilla chrome
119
+ Layer.prototype.setVisibility = function(f) {
120
+ this.div.style.visibility = (f ? "visible" : "hidden");
121
+ };
122
+ Layer.prototype.getX = function() {
123
+ return parseInt(this.div.style.left);
124
+ };
125
+ Layer.prototype.getY = function() {
126
+ return parseInt(this.div.style.top);
127
+ };
128
+ Layer.prototype.moveTo = function(x, y) {
129
+ this.div.style.left = x;
130
+ this.div.style.top = y;
131
+ };
132
+ Layer.prototype.moveBy = function(dx, dy) {
133
+ this.div.style.left = parseInt(this.div.style.left) + dx;
134
+ this.div.style.top = parseInt(this.div.style.top) + dy;
135
+
136
+ };
137
+
138
+ this.getLayer = function(id) {
139
+ return new Layer(document.getElementById(id));
140
+ };
141
+ }
142
+ else {
143
+ // NN4
144
+ Layer.prototype.setVisibility = function(f) {
145
+ this.div.visibility = (f ? "show" : "hide");
146
+ };
147
+ Layer.prototype.getX = function() {
148
+ return this.div.left;
149
+ };
150
+ Layer.prototype.getY = function() {
151
+ return this.div.top;
152
+ };
153
+ Layer.prototype.moveTo = function(x, y) {
154
+ this.div.moveTo(x, y);
155
+ };
156
+ Layer.prototype.moveBy = function(dx, dy) {
157
+ this.div.moveBy(dx, dy);
158
+ };
159
+
160
+ this.getLayer = function(id) {
161
+ var i = arguments.length - 1;
162
+ var layer = document.layers[arguments[i--]];
163
+ while(i >= 0 && layer) {
164
+ layer = layer.layers[arguments[i--]];
165
+ }
166
+ return new Layer(layer);
167
+ };
168
+ }
169
+ }
170
+
171
+ function Layer(div)
172
+ {
173
+ this.div = div;
174
+ }
175
+
176
+
177
+ var domtool; // DOM依存のツール
178
+
179
+ var left, top, width, height, cell;
180
+ var mv = 100;
181
+ var pathinfo;
182
+ var reloading = false;
183
+
184
+ var ctrlbreak = false;
185
+ var movingID = null;
186
+
187
+ var CilckFlag1=0;
188
+
189
+ function init(x, y, w, h, c, t)
190
+ {
191
+ domtool = new DomToolkit();
192
+
193
+ left = x;
194
+ top = 0;
195
+ width = w;
196
+ height = 288;
197
+ cell = c;
198
+
199
+ pathinfo = location.search.replace(/&px=\d*|&py=\d*|&ctrl=\d*|&?msg=[^&]*/ig, "");
200
+ setTimeout("reloadFrame()", t * 1000);
201
+
202
+ setInterval("breakControl()", 60);
203
+
204
+ setTimeout("initEventHandler()", 100);
205
+ }
206
+
207
+ function initEventHandler()
208
+ {
209
+ // 入力フレームの生成待ち
210
+ if(!parent.input
211
+ || !parent.input.document
212
+ || !parent.input.document.cursor
213
+ || !parent.input.document.cursor.down) {
214
+ setTimeout("initEventHandler()", 100);
215
+ return;
216
+ }
217
+
218
+ if(document.all) {
219
+ // IE
220
+ document.onkeypress = handleKeypress;
221
+
222
+ with(parent.input) {
223
+ document.cursor.left.onmousedown = handleMouseDown;
224
+ document.cursor.right.onmousedown = handleMouseDown;
225
+ document.cursor.up.onmousedown = handleMouseDown;
226
+ document.cursor.down.onmousedown = handleMouseDown;
227
+ document.onmouseup = handleMouseUp;
228
+ }
229
+ }
230
+ else if(document.getElementById) {
231
+ // Mozilla
232
+ document.addEventListener("keypress", handleKeypress, true);
233
+
234
+ with(parent.input) {
235
+ document.cursor.left.addEventListener("mousedown", handleMouseDown, true);
236
+ document.cursor.right.addEventListener("mousedown", handleMouseDown, true);
237
+ document.cursor.up.addEventListener("mousedown", handleMouseDown, true);
238
+ document.cursor.down.addEventListener("mousedown", handleMouseDown, true);
239
+ document.addEventListener("mouseup", handleMouseUp, false);
240
+ }
241
+ }
242
+ else {
243
+ // NN4
244
+ document.onkeypress = handleKeypress;
245
+ document.captureEvents(Event.KEYPRESS);
246
+
247
+ with(parent.input) {
248
+ document.cursor.left.onmousedown = handleMouseDown;
249
+ document.cursor.right.onmousedown = handleMouseDown;
250
+ document.cursor.up.onmousedown = handleMouseDown;
251
+ document.cursor.down.onmousedown = handleMouseDown;
252
+ document.onmouseup = handleMouseUp;
253
+ document.captureEvents(Event.MOUSEUP);
254
+ }
255
+ }
256
+ }
257
+
258
+ function handleKeypress(event)
259
+ {
260
+ if(ctrlbreak) {
261
+ return false;
262
+ }
263
+ ctrlbreak = true;
264
+
265
+ if(document.all) {
266
+ key = window.event.keyCode;
267
+ }
268
+ else {
269
+ key = event.which;
270
+ }
271
+ moveChar(String.fromCharCode(key));
272
+ }
273
+
274
+ function breakControl()
275
+ {
276
+ ctrlbreak = false;
277
+ }
278
+
279
+
280
+ function handleMouseDown(event) {
281
+ if(movingID != null) {
282
+ clearInterval(movingID);
283
+ movingID = null;
284
+ }
285
+
286
+ if(document.all) {
287
+ button = parent.input.event.srcElement.name;
288
+ }
289
+ else {
290
+ button = event.target.name;
291
+ }
292
+
293
+ switch(button) {
294
+ case 'left':
295
+ keych = '4'; break;
296
+ case 'right':
297
+ keych = '6'; break;
298
+ case 'up':
299
+ keych = '8'; break;
300
+ case 'down':
301
+ keych = '2'; break;
302
+ default:
303
+ keych = '5';
304
+ }
305
+ movingID = setInterval("moveChar('" + keych + "')", 60);
306
+ }
307
+
308
+ function handleMouseUp(event) {
309
+ if(movingID != null) {
310
+ clearInterval(movingID);
311
+ movingID = null;
312
+ }
313
+ }
314
+
315
+ function reloadFrame()
316
+ {
317
+ if(reloading) {
318
+ return;
319
+ }
320
+ reloading = true;
321
+
322
+ layer = domtool.getLayer("char0");
323
+ x = layer.getX();
324
+ y = layer.getY();
325
+ location.search = pathinfo + "&px=" + x + "&py=" + y;
326
+ }
327
+
328
+ function moveChar(key)
329
+ {
330
+ var key2 = key;
331
+ if(reloading) {
332
+ return;
333
+ }
334
+
335
+ layer = domtool.getLayer("char0");
336
+ x = layer.getX();
337
+ y = layer.getY();
338
+
339
+ dx = 0;
340
+ dy = 0;
341
+ switch(key2) {
342
+ case '4': // left
343
+ dx = -mv;
344
+ if(x + dx < left) {
345
+ location.search = pathinfo + "&px=" + x + "&py=" + y + "&ctrl=4";
346
+ reloading = true;
347
+ }
348
+ break;
349
+
350
+ case '6': // right
351
+ dx = mv;
352
+ if(x + dx + cell > left + width) {
353
+ location.search = pathinfo + "&px=" + x + "&py=" + y + "&ctrl=6";
354
+ reloading = true;
355
+ }
356
+ break;
357
+
358
+ case '8': // up
359
+ dy = -mv;
360
+ // if(y + dy < top) {
361
+ if(y + dy < 0) {
362
+ location.search = pathinfo + "&px=" + x + "&py=" + y + "&ctrl=8";
363
+ reloading = true;
364
+ }
365
+ break;
366
+
367
+ case '2': // down
368
+ dy = mv;
369
+ // if(y + dy + cell > top + height) {
370
+ if(y + dy + cell > 288 ) {
371
+ location.search = pathinfo + "&px=" + x + "&py=" + y + "&ctrl=2";
372
+ reloading = true;
373
+ }
374
+ break;
375
+ }
376
+
377
+ if(!reloading) {
378
+ layer.moveBy(dx, dy);
379
+
380
+ layer2 = domtool.getLayer("balloon0");
381
+ layer3 = domtool.getLayer("text0");
382
+
383
+ if(layer2.div && layer3.div) {
384
+ layer2.moveBy(dx, dy);
385
+ layer3.moveBy(dx, dy);
386
+ }
387
+ }
388
+ }
389
+
390
+ function getCharLeft()
391
+ {
392
+ return domtool.getLayer("char0").getX();
393
+ }
394
+
395
+ function getCharTop()
396
+ {
397
+ return domtool.getLayer("char0").getY();
398
+ }
399
+
400
+
401
+ function OnButtonClick1() {
402
+
403
+ if(CilckFlag1==1){
404
+ target = document.getElementById("output1");
405
+ target.innerHTML = "クリックされました！！";
406
+ CilckFlag1=0;
407
+ }else if(CilckFlag1==0){
408
+ target = document.getElementById("output1");
409
+ target.innerHTML = "クリックさてません。。。";
410
+ CilckFlag1=1;
411
+ }
412
+ }
413
+
414
+ コード
415
+ ```
416
+
417
+ 今、ボタンをクリックしても状態が変わらず、つまづいています。