質問編集履歴
2
誤字の修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -20,24 +20,23 @@
|
|
|
20
20
|
v.handle @ jquery.min.js:2
|
|
21
21
|
```
|
|
22
22
|
|
|
23
|
-
###
|
|
23
|
+
### jQuely
|
|
24
24
|
```
|
|
25
25
|
$(function() {
|
|
26
26
|
|
|
27
27
|
// 画像をクリックしたら発動
|
|
28
28
|
$('div.character').on('click', function() {
|
|
29
29
|
|
|
30
|
-
//
|
|
30
|
+
// 要素の表示・非表示を切り替えてコメントを表示
|
|
31
31
|
$('div.text').fadeIn(500);
|
|
32
32
|
$('div.change').fadeIn(500);
|
|
33
33
|
$('div.character').fadeOut(500);
|
|
34
34
|
|
|
35
|
-
// 時間経過で
|
|
35
|
+
// 時間経過で要素の表示・非表示をもとに戻してコメントを非表示
|
|
36
36
|
$('div.text').delay(4000).fadeOut(500);
|
|
37
37
|
$('div.change').delay(4000).fadeOut(500);
|
|
38
38
|
$('div.character').delay(4000).fadeIn(500);
|
|
39
|
-
|
|
40
|
-
|
|
39
|
+
|
|
41
40
|
// リストアップ
|
|
42
41
|
var elements = [
|
|
43
42
|
['コメントA', './img/a.png'],
|
|
@@ -52,7 +51,7 @@
|
|
|
52
51
|
// 表示エリアにコメントを挿入
|
|
53
52
|
$('div.word').html(randElm[0]);
|
|
54
53
|
|
|
55
|
-
// 表示エリアに切り替え画像を挿入
|
|
54
|
+
// 表示エリアに切り替え用画像を挿入
|
|
56
55
|
var img = document.getElementById('change_image');
|
|
57
56
|
img.src = 'randImg[1]';
|
|
58
57
|
|
|
@@ -71,17 +70,17 @@
|
|
|
71
70
|
|
|
72
71
|
### 試したこと
|
|
73
72
|
```
|
|
74
|
-
// リストの数をチェックしてランダムに取得（の
|
|
73
|
+
// リストの数をチェックしてランダムに取得（の切り替え用画像部分）
|
|
75
74
|
var randImg = elements[Math.floor(Math.random() * elements.length)];
|
|
76
75
|
|
|
77
|
-
//
|
|
76
|
+
// 切り替え用画像を表示させる（の全ての記述）
|
|
78
77
|
var img = document.getElementById('change_image');
|
|
79
78
|
img.src = 'randImg[1]';
|
|
80
79
|
```
|
|
81
80
|
上記を削除すると、ランダムにはならないものの画像自体は表示される（HTMLで指定しているため）ので
|
|
82
81
|
jQuelyの切り替え画像に関する部分の記述に問題があるのかな？と思っているのですが、具体的にどう書き換えればいいのかがわかりません
|
|
83
82
|
|
|
84
|
-
|
|
83
|
+
切り替え用の画像が表示されないが故に挙動がおかしくなっているようなので
|
|
85
84
|
単純に画像パスの記述ミスかとも思ったのですが、前述の通りHTMLで指定した画像は表示されるので
|
|
86
85
|
そちらは間違っていないように感じます
|
|
87
86
|
（一応補足すると、HTMLと同じ階層に画像フォルダをつくり、その中に画像を入れています）
|
1
文章の修正
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
文字列と
|
|
1
|
+
文字列とセットにした画像をクリックによりランダムに表示させたい
|
body
CHANGED
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
### 前提・実現したいこと
|
|
2
2
|
|
|
3
|
-
殆どコピペに頼っている
|
|
3
|
+
殆どコピペに頼っている初心者ですが、よろしくお願いいたします
|
|
4
4
|
|
|
5
|
-
画像をクリックする
|
|
5
|
+
・画像をクリックするたびに要素の表示・非表示の動作が発生し数秒後もとの状態に戻る
|
|
6
|
-
|
|
6
|
+
・クリックで表示される画像と文字列がセットになったものは数パターンあり、ランダムに表示される
|
|
7
7
|
|
|
8
|
+
上記のような遊びのページを作ろうとしています
|
|
9
|
+
|
|
8
10
|
### 発生している問題・エラーメッセージ
|
|
9
11
|
|
|
10
|
-
|
|
12
|
+
切り替え用画像が表示されず（非表示マークが出ている）
|
|
11
|
-
|
|
13
|
+
画像とセットで表示されるようにした文字列も切り替え用画像を表示させるタイミングで消えてしまう
|
|
12
14
|
|
|
13
15
|
```
|
|
14
16
|
net::ERR_FILE_NOT_FOUND
|
|
@@ -50,7 +52,7 @@
|
|
|
50
52
|
// 表示エリアにコメントを挿入
|
|
51
53
|
$('div.word').html(randElm[0]);
|
|
52
54
|
|
|
53
|
-
//
|
|
55
|
+
// 表示エリアに切り替え画像を挿入
|
|
54
56
|
var img = document.getElementById('change_image');
|
|
55
57
|
img.src = 'randImg[1]';
|
|
56
58
|
|
|
@@ -68,8 +70,6 @@
|
|
|
68
70
|
```
|
|
69
71
|
|
|
70
72
|
### 試したこと
|
|
71
|
-
下記を削除するとランダム表示にはならないものの画像は表示される（HTMLで指定しているため）ので、
|
|
72
|
-
jquelyの差し替え画像を表示させる部分の記述を変更することできちんと挙動するようにしたいです
|
|
73
73
|
```
|
|
74
74
|
// リストの数をチェックしてランダムに取得（の差し替え画像部分）
|
|
75
75
|
var randImg = elements[Math.floor(Math.random() * elements.length)];
|
|
@@ -78,8 +78,12 @@
|
|
|
78
78
|
var img = document.getElementById('change_image');
|
|
79
79
|
img.src = 'randImg[1]';
|
|
80
80
|
```
|
|
81
|
+
上記を削除すると、ランダムにはならないものの画像自体は表示される（HTMLで指定しているため）ので
|
|
82
|
+
jQuelyの切り替え画像に関する部分の記述に問題があるのかな？と思っているのですが、具体的にどう書き換えればいいのかがわかりません
|
|
83
|
+
|
|
81
84
|
差し替え用の画像が表示されないが故に挙動がおかしくなっているようなので
|
|
82
|
-
単純に画像パスの記述ミスか
|
|
85
|
+
単純に画像パスの記述ミスかとも思ったのですが、前述の通りHTMLで指定した画像は表示されるので
|
|
86
|
+
そちらは間違っていないように感じます
|
|
83
|
-
（HTMLと同じ階層に画像フォルダをつくり、その中に画像を入れています）
|
|
87
|
+
（一応補足すると、HTMLと同じ階層に画像フォルダをつくり、その中に画像を入れています）
|
|
84
88
|
|
|
85
89
|
どうかご教示願います
|