質問編集履歴
1
内容修正です
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
【JS】
|
1
|
+
【JS】画面サイズによって変化するareaタグのcoordsの初期値を保持したいです。
|
test
CHANGED
@@ -7,6 +7,46 @@
|
|
7
7
|
というスクリプトを書いています。
|
8
8
|
|
9
9
|
実際の値の調整は、外部スクリプトのrwd_map()という関数で実行しています。
|
10
|
+
|
11
|
+
|
12
|
+
|
13
|
+
```Javascript
|
14
|
+
|
15
|
+
<script type="text/javascript">
|
16
|
+
|
17
|
+
$(window).on('load',function(){
|
18
|
+
|
19
|
+
map = document.getElementById('map_area'); //areaのid名
|
20
|
+
|
21
|
+
img_map = document.getElementById('map'); //mapを利用する画像のid名
|
22
|
+
|
23
|
+
rwd_map(map,img_map);//rwd_map.jsを呼び出し
|
24
|
+
|
25
|
+
});
|
26
|
+
|
27
|
+
$(window).on('scroll resize',function(){
|
28
|
+
|
29
|
+
rwd_map(map,img_map);//rwd_map.jsを呼び出し
|
30
|
+
|
31
|
+
});
|
32
|
+
|
33
|
+
</script>
|
34
|
+
|
35
|
+
```
|
36
|
+
|
37
|
+
|
38
|
+
|
39
|
+
|
40
|
+
|
41
|
+
|
42
|
+
|
43
|
+
```HTML
|
44
|
+
|
45
|
+
<img src="img/test_01.jpg" id="map" usemap="#map"/>
|
46
|
+
|
47
|
+
<map name="map"><area id="map_area" onmouseover="changeMapImage('img/test_01_hover.jpg')" onmouseout="changeMapImage('img/test_01.jpg')" shape="rect" href="http://" coords="349,537,980,627"></map>
|
48
|
+
|
49
|
+
```
|
10
50
|
|
11
51
|
|
12
52
|
|
@@ -28,9 +68,9 @@
|
|
28
68
|
|
29
69
|
|
30
70
|
|
31
|
-
しかし、scrollやresizeが発生すると、グローバル変数であるmapの値も
|
71
|
+
しかし、scrollやresizeが発生すると、**グローバル変数であるmapの値も
|
32
72
|
|
33
|
-
動的に変化していってしまい、うまくいきません。
|
73
|
+
動的に変化**していってしまい、うまくいきません。
|
34
74
|
|
35
75
|
|
36
76
|
|
@@ -39,37 +79,3 @@
|
|
39
79
|
|
40
80
|
|
41
81
|
よろしくお願いいたします。
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
JS
|
46
|
-
|
47
|
-
<script type="text/javascript">
|
48
|
-
|
49
|
-
$(window).on('load',function(){
|
50
|
-
|
51
|
-
map = document.getElementById('map_area'); //areaのid名
|
52
|
-
|
53
|
-
img_map = document.getElementById('map'); //mapを利用する画像のid名
|
54
|
-
|
55
|
-
rwd_map(map,img_map);//rwd_map.jsを呼び出し
|
56
|
-
|
57
|
-
});
|
58
|
-
|
59
|
-
$(window).on('scroll resize',function(){
|
60
|
-
|
61
|
-
rwd_map(map,img_map);//rwd_map.jsを呼び出し
|
62
|
-
|
63
|
-
});
|
64
|
-
|
65
|
-
</script>
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
HTML5
|
72
|
-
|
73
|
-
<img src="img/test_01.jpg" id="map" usemap="#map"/>
|
74
|
-
|
75
|
-
<map name="map"><area id="map_area" onmouseover="changeMapImage('img/test_01_hover.jpg')" onmouseout="changeMapImage('img/test_01.jpg')" shape="rect" href="http://" coords="349,537,980,627"></map>
|