回答編集履歴

1

chousei

2021/08/04 08:42

投稿

yambejp
yambejp

スコア114883

test CHANGED
@@ -2,12 +2,88 @@
2
2
 
3
3
  ```CSS
4
4
 
5
- html{
6
-
7
5
  transform: scale(num);
8
-
9
- }
10
6
 
11
7
  ```
12
8
 
13
9
  とからめて大きめ(小さめ)に表示したりすることは可能です
10
+
11
+
12
+
13
+ # sample
14
+
15
+
16
+
17
+ ```javascript
18
+
19
+
20
+
21
+ <style>
22
+
23
+ body {
24
+
25
+ transform-origin: top left;
26
+
27
+ }
28
+
29
+ body.big {
30
+
31
+ transform: scale(1.5);
32
+
33
+ }
34
+
35
+ body.small {
36
+
37
+ transform: scale(0.7);
38
+
39
+ }
40
+
41
+ </style>
42
+
43
+ <script>
44
+
45
+ window.addEventListener('DOMContentLoaded', ()=>{
46
+
47
+ big.addEventListener('click',()=>{
48
+
49
+ document.body.classList.remove('small');
50
+
51
+ document.body.classList.add('big');
52
+
53
+ });
54
+
55
+ regular.addEventListener('click',()=>{
56
+
57
+ document.body.classList.remove('big');
58
+
59
+ document.body.classList.remove('small');
60
+
61
+ });
62
+
63
+ small.addEventListener('click',()=>{
64
+
65
+ document.body.classList.remove('big');
66
+
67
+ document.body.classList.add('small');
68
+
69
+ });
70
+
71
+ });
72
+
73
+ </script>
74
+
75
+ <input type="button" value="big" id="big">
76
+
77
+ <input type="button" value="regular" id="regular">
78
+
79
+ <input type="button" value="small" id="small">
80
+
81
+ <hr>
82
+
83
+ あああ
84
+
85
+ <img src="http://placeimg.com/400/240/any">
86
+
87
+
88
+
89
+ ```