質問編集履歴

5

2019/11/08 03:06

投稿

coron.1
coron.1

スコア5

test CHANGED
File without changes
test CHANGED
File without changes

4

2019/11/08 03:06

投稿

coron.1
coron.1

スコア5

test CHANGED
@@ -1 +1 @@
1
- Javascript
1
+ Pythonでかくif文章
test CHANGED
@@ -1,59 +1,45 @@
1
- CSS
1
+ def if_test(num):
2
2
 
3
- .cp_tooltip {
3
+ if num > 100:
4
4
 
5
- display: inline-block;
5
+ print('100 < num')
6
6
 
7
- }
7
+ elif num > 50:
8
8
 
9
- .cp_tooltiptext {
9
+ print('50 < num <= 100')
10
10
 
11
- position: relative;
11
+ elif num > 0:
12
12
 
13
- cursor: pointer;
13
+ print('0 < num <= 50')
14
14
 
15
- background: linear-gradient(transparent 60%, #f1f1f1 60%);
15
+ elif num == 0:
16
16
 
17
- }
17
+ print('num == 0')
18
18
 
19
- .cp_tooltiptext::after {
19
+ else:
20
20
 
21
- position: absolute;
21
+ print('num < 0')
22
22
 
23
- transition: all 0.3s ease 0s;
24
23
 
25
- opacity: 0;
26
24
 
27
- top: 26px;/*HOVERのスタート位置*/
25
+ if_test(1000)
28
26
 
29
- left: 0px;
27
+ # 100 < num
30
28
 
31
- display: block;
32
29
 
33
- padding: 0.2em 0.5em;
34
30
 
35
- content: attr(data-tooltip);
31
+ if_test(70)
36
32
 
37
- white-space: nowrap;
33
+ # 50 < num <= 100
38
34
 
39
- color: #000000;
40
35
 
41
- border-radius: 6px;
42
36
 
43
- background: #ffffff;
37
+ if_test(0)
44
38
 
45
- }
39
+ # num == 0
46
40
 
47
- .cp_tooltiptext:hover::after {
48
41
 
49
- top: 26px;
50
42
 
51
- opacity: 1;
43
+ if_test(-100)
52
44
 
53
- }
54
-
55
- ### 試したこと
45
+ # num < 0
56
-
57
- javascript
58
-
59
- ### 補足情報(FW/ツールのバージョンなど)

3

2019/11/08 03:00

投稿

coron.1
coron.1

スコア5

test CHANGED
File without changes
test CHANGED
@@ -1,5 +1,3 @@
1
- クリックした単語をクリックしたことが分かるように色を変化させたりして
2
-
3
1
  CSS
4
2
 
5
3
  .cp_tooltip {
@@ -56,6 +54,6 @@
56
54
 
57
55
  ### 試したこと
58
56
 
59
- javascriptでif文でクリックされたときクリックされた文字にクリックされたことが分かるようにデータを格納したいです。そのあとはデータが。格納されたことが視覚的にわかるように色を変えるなどの機能を付けたいと考えています。
57
+ javascript
60
58
 
61
59
  ### 補足情報(FW/ツールのバージョンなど)

2

2019/11/08 02:56

投稿

coron.1
coron.1

スコア5

test CHANGED
@@ -1 +1 @@
1
- Javascriptで2以降の実現方法
1
+ Javascript
test CHANGED
@@ -1,96 +1,6 @@
1
- ### 前提・実現したいこと
2
-
3
- ①文字の上にカーソルを合わせたらポップアップで翻訳が出る
4
-
5
- ②文章をクリックできるようにする
6
-
7
- ③自分がわかる英単語をクリックしたら翻訳が出ないようにする
8
-
9
- クリックした単語をクリックしたことが分かるように色を変化させたりして記録していく
1
+ クリックした単語をクリックしたことが分かるように色を変化させたりして
10
-
11
- (イメージはクリックされた単語一つ一つにデータが記録されていく感じとアドバイスを受けました
12
-
13
-
14
-
15
-
16
-
17
- ②以降の実現方法を教えていただきたいです。
18
-
19
- ### 発生している問題・エラーメッセージ
20
-
21
-
22
-
23
- ```
24
-
25
- エラーメッセージ
26
-
27
- ```
28
-
29
-
30
-
31
- ### 該当のソースコード
32
-
33
-
34
-
35
- ``HTMl
36
-
37
- <!DOCTYPE html>
38
-
39
- <html lang="ja">
40
-
41
- <head>
42
-
43
-
44
-
45
- <meta charset="UTF-8">
46
-
47
- <link rel="stylesheet" type="text/css" href="pop.css">
48
-
49
- </head>
50
-
51
- <body>
52
-
53
-
54
-
55
- <span onClick="document.all.item('moji2').style.visibility='visible'" onClick="document.all.item('moji2').style.visibility='hidden'">
56
-
57
- <span onClick="document.all.item('moji1').style.visibility='visible'">
58
-
59
- <div class="cp_tooltip"><span data-tooltip="私は" class="cp_tooltiptext">I</span></div>
60
-
61
- <div class="cp_tooltip"><span data-tooltip="です" class="cp_tooltiptext">am</span></div>
62
-
63
- <div class="cp_tooltip"><span data-tooltip="一人の" class="cp_tooltiptext">a</span></div>
64
-
65
- <div class="cp_tooltip"><span data-tooltip="学生" class="cp_tooltiptext">student</span></div>
66
-
67
- </span>
68
-
69
-
70
-
71
- <div ID="moji1" style="visibility:hidden;">
72
-
73
-
74
-
75
- </div>
76
-
77
-
78
-
79
- </body>
80
-
81
-
82
-
83
-
84
-
85
- </html>
86
-
87
- ```
88
-
89
-
90
2
 
91
3
  CSS
92
-
93
-
94
4
 
95
5
  .cp_tooltip {
96
6
 
@@ -138,7 +48,7 @@
138
48
 
139
49
  .cp_tooltiptext:hover::after {
140
50
 
141
- top: 26px;/*HOVER位置*/
51
+ top: 26px;
142
52
 
143
53
  opacity: 1;
144
54
 
@@ -149,7 +59,3 @@
149
59
  javascriptでif文でクリックされたときクリックされた文字にクリックされたことが分かるようにデータを格納したいです。そのあとはデータが。格納されたことが視覚的にわかるように色を変えるなどの機能を付けたいと考えています。
150
60
 
151
61
  ### 補足情報(FW/ツールのバージョンなど)
152
-
153
-
154
-
155
- VScodeを使用しています

1

2019/11/08 02:55

投稿

coron.1
coron.1

スコア5

test CHANGED
@@ -1 +1 @@
1
- 単語をクリックきるようにする方法
1
+ Javascript2以降の実現方法
test CHANGED
@@ -9,6 +9,12 @@
9
9
  ④クリックした英単語をクリックしたことが分かるように色を変化させたりして記録していく
10
10
 
11
11
  (イメージはクリックされた単語一つ一つにデータが記録されていく感じとアドバイスを受けました
12
+
13
+
14
+
15
+
16
+
17
+ ②以降の実現方法を教えていただきたいです。
12
18
 
13
19
  ### 発生している問題・エラーメッセージ
14
20