質問編集履歴

5

内容の整理

2017/05/11 05:38

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -1,413 +1,293 @@
1
1
  #困っていること
2
2
 
3
+
4
+
5
+ 現在index.php内でページ内リンクを実装しています。
6
+
7
+
8
+
9
+ [portfolio]と[contact]のリンクはうまく移動してくれるのですが、
10
+
11
+ なぜか[about]だけサイトのトップにリンクしてしまいます。
12
+
13
+ (一番上までスクロールした状態では動かず、最下部でクリックすると最上部に飛ぶ)
14
+
15
+
16
+
17
+ 先ほどまでは正常に動いていて、
18
+
19
+ フォントの単位指定を変更した後、確認していたら動かなくなっていました。
20
+
21
+
22
+
23
+
24
+
25
+ ※ちなみに画面サイズを大きくすれば動きます。
26
+
27
+ ※スマホサイズぐらいにすると動きません。
28
+
29
+ ※ローカル環境のみで発生 サーバーに上げると解消
30
+
31
+ ※問題の[id="About"]に対してフォント以外のCSS(borderやpadding等)が効かない現象も併発しています。
32
+
33
+
34
+
35
+
36
+
37
+ ページ内リンクが動かなくなる可能性としてはどんな原因が考えられるのでしょうか?
38
+
39
+ よろしくお願いします。
40
+
3
41
  ```html
4
42
 
5
- <ul class="nav nav-pills active">
6
-
7
- <li><a href="#contact">Contact</a></li>
8
-
9
- <li><a href="#about">About</a></li>
10
-
11
- <li><a href="#portfolio">Portfolio</a></li>
12
-
13
- </ul>
43
+ <!DOCTYPE html>
44
+
45
+ <html>
46
+
47
+ <head>
48
+
49
+ <meta charset=UTF-8">
50
+
51
+ <meta name="description" content="Hirotaka OPriguchiのポートフォリオ">
52
+
53
+ <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
54
+
55
+ <title>Hocus Pocus</title>
56
+
57
+ <link href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/style.css" rel="stylesheet" media="screen">
58
+
59
+ <link rel="stylesheet" href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/genericons/genericons.css" type="text/css" />
60
+
61
+ <link href="https://fonts.googleapis.com/css?family=Cinzel+Decorative" rel="stylesheet">
62
+
63
+ <link href="https://fonts.googleapis.com/css?family=Sorts+Mill+Goudy" rel="stylesheet">
64
+
65
+ <script type="text/javascript">
66
+
67
+ window._wpemojiSettings = {"baseUrl":"http:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/127.0.0.1:4001\/wordpress\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.2.4"}};
68
+
69
+ !function(a,b,c){function d(a){var c=b.createElement("canvas"),d=c.getContext&&c.getContext("2d");return d&&d.fillText?(d.textBaseline="top",d.font="600 32px Arial","flag"===a?(d.fillText(String.fromCharCode(55356,56812,55356,56807),0,0),c.toDataURL().length>3e3):(d.fillText(String.fromCharCode(55357,56835),0,0),0!==d.getImageData(16,16,1,1).data[0])):!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g;c.supports={simple:d("simple"),flag:d("flag")},c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.simple&&c.supports.flag||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
70
+
71
+ </script>
72
+
73
+ <style type="text/css">
74
+
75
+ img.wp-smiley,
76
+
77
+ img.emoji {
78
+
79
+ display: inline !important;
80
+
81
+ border: none !important;
82
+
83
+ box-shadow: none !important;
84
+
85
+ height: 1em !important;
86
+
87
+ width: 1em !important;
88
+
89
+ margin: 0 .07em !important;
90
+
91
+ vertical-align: -0.1em !important;
92
+
93
+ background: none !important;
94
+
95
+ padding: 0 !important;
96
+
97
+ }
98
+
99
+ </style>
100
+
101
+ <link rel='stylesheet' id='bootstrap-css-css' href='http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/lib/css/bootstrap.min.css?ver=4.2.4' type='text/css' media='all' />
102
+
103
+ <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-includes/js/jquery/jquery.js?ver=1.11.2'></script>
104
+
105
+ <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
106
+
107
+ <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://127.0.0.1:4001/wordpress/xmlrpc.php?rsd" />
108
+
109
+ <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://127.0.0.1:4001/wordpress/wp-includes/wlwmanifest.xml" />
110
+
111
+ <meta name="generator" content="WordPress 4.2.4" />
112
+
113
+ <link rel="shortcut icon" type="image/x-icon" href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/favicon.ico" />
114
+
115
+
116
+
117
+ <script>
118
+
119
+ //スムーズスクロール
120
+
121
+ jQuery(function(){
122
+
123
+ // #で始まるアンカーをクリックした場合に処理
124
+
125
+ jQuery('a[href^=#]').click(function() {
126
+
127
+ // スクロールの速度
128
+
129
+ var speed = 350; // ミリ秒
130
+
131
+ // アンカーの値取得
132
+
133
+ var href= jQuery(this).attr("href");
134
+
135
+ // 移動先を取得
136
+
137
+ var target = jQuery(href == "#" || href == "" ? 'html' : href);
138
+
139
+ // 移動先を数値で取得
140
+
141
+ var position = target.offset().top;
142
+
143
+ // スムーズスクロール
144
+
145
+ jQuery('body,html').animate({scrollTop:position}, speed, 'swing');
146
+
147
+ return false;
148
+
149
+ });
150
+
151
+ });
152
+
153
+ </script>
154
+
155
+
156
+
157
+ </head>
158
+
159
+ <body>
160
+
161
+
162
+
163
+ <div id="header">
164
+
165
+ <ul class="nav nav-pills active">
166
+
167
+ <li><a href="#contact">Contact</a></li>
168
+
169
+ <li><a href="#about">About</a></li>
170
+
171
+ <li><a href="#portfolio">Portfolio</a></li>
172
+
173
+ </ul>
174
+
175
+ </div>
176
+
177
+ <section id="top" class="block">
178
+
179
+ <div class="col-xs-12">
180
+
181
+ <img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/sample.jpg" class="img-responsive">
182
+
183
+ <p class="title">Hirotaka Origuchi Photography</p>
184
+
185
+ </div>
186
+
187
+ </section>
188
+
189
+
190
+
191
+ <section id="portfolio" class="block">
192
+
193
+ <div class="container">
194
+
195
+ <div class="row mainlink">
196
+
197
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
198
+
199
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
200
+
201
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
202
+
203
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
204
+
205
+ </div>
206
+
207
+ </div>
208
+
209
+ </section>
210
+
211
+
212
+
213
+ <div class="info">
214
+
215
+ <section id="about" class="block">
216
+
217
+ <h2 class="ab">About</h2>
218
+
219
+ <h4>~Hirotaka Origuchi~</h4>
220
+
221
+ <p>1995年生まれ、岡山県在住<br>2016年にカメラを始め、同年5月に<a href="https://lovegraph.me/">Lovegraph</a>にジョイン。<br>その夏からポートレート撮影を開始。<br>2017年10月より<br><a href="http://www.studioaim.jp/harajuku.html">creative photostudio aim</a>原宿店に勤務</p>
222
+
223
+ <h4>~Equipment~</h4>
224
+
225
+ <p>Canon EOS 6D<br>Canon EOS 80D<br>Sigma Art 135mm<br>Sigma Art 30mm<br>iPhone6S</p>
226
+
227
+ </section>
228
+
229
+
230
+
231
+ <section id="contact" class="block">
232
+
233
+ <h2 class="co">Contact</h2>
234
+
235
+ <h4>~E-Mail~</h4>
236
+
237
+ <a href="mailto:lostsymbol612@gmail.com" class="mail">メールで連絡する</a>
238
+
239
+ <h4>~SNS Link~</h4>
240
+
241
+ <div class="table-responsive">
242
+
243
+ <table class="table">
244
+
245
+ <tr>
246
+
247
+ <td><a href="https://instagram.com/hirotaka612" class="sns">Instagram</a></td>
248
+
249
+ <td><a href="https://www.facebook.com/hocuspocusphotographer/" class="sns">Facebook</a></td>
250
+
251
+ </tr>
252
+
253
+ <tr>
254
+
255
+ <td><a href="https://500px.com/hirotaka612" class="sns">500px</a></td>
256
+
257
+ <td><a href="https://twitter.com/HocusPocusPhoto" class="sns">Twitter</a></td>
258
+
259
+ </tr>
260
+
261
+ <tr>
262
+
263
+ <td><a href="https://mstdn.tokyocameraclub.com/@HirotakaOriguchi" class="sns">Mstdn</a></td>
264
+
265
+ <td></td>
266
+
267
+ </tr>
268
+
269
+ </table>
270
+
271
+ </div>
272
+
273
+ </section>
274
+
275
+ </div>
276
+
277
+
278
+
279
+ <div id="footer">
280
+
281
+ <p class="copy">&copy;2017 Hirotaka Origuchi</p>
282
+
283
+ <a class="genericon genericon-collapse" href="#top"></a>
284
+
285
+ </div>
286
+
287
+ <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/lib/js/bootstrap.min.js?ver=1.0.0'></script>
288
+
289
+ </body>
290
+
291
+ </html>
14
292
 
15
293
  ```
16
-
17
-
18
-
19
- ```php
20
-
21
- <?php get_header(); ?>
22
-
23
-
24
-
25
- <section id="top" class="block">
26
-
27
- <div class="col-xs-12">
28
-
29
- <img src="<?php echo get_template_directory_uri(); ?>/img/sample.jpg" class="img-responsive">
30
-
31
- <p class="title">Hirotaka Origuchi Photography</p>
32
-
33
- </div>
34
-
35
- </section>
36
-
37
-
38
-
39
- <section id="portfolio" class="block">
40
-
41
- <div class="container">
42
-
43
- <div class="row mainlink">
44
-
45
- <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
46
-
47
- <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
48
-
49
- <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
50
-
51
- <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
52
-
53
- </div>
54
-
55
- </div>
56
-
57
- </section>
58
-
59
-
60
-
61
- <div class="info">
62
-
63
- <section id="about" class="block">
64
-
65
- <h2 class="ab">About</h2>
66
-
67
- <h4>~Hirotaka Origuchi~</h4>
68
-
69
- <p>1995年生まれ、岡山県在住<br>2016年にカメラを始め、同年5月に<a href="https://lovegraph.me/">Lovegraph</a>にジョイン。<br>その夏からポートレート撮影を開始。<br>2017年10月より<br><a href="http://www.studioaim.jp/harajuku.html">creative photostudio aim</a>原宿店に勤務</p>
70
-
71
- <h4>~Equipment~</h4>
72
-
73
- <p>Canon EOS 6D<br>Canon EOS 80D<br>Sigma Art 135mm<br>Sigma Art 30mm<br>iPhone6S</p>
74
-
75
- </section>
76
-
77
-
78
-
79
- <section id="contact" class="block">
80
-
81
- <h2 class="co">Contact</h2>
82
-
83
- <h4>~E-Mail~</h4>
84
-
85
- <a href="mailto:lostsymbol612@gmail.com" class="mail">メールで連絡する</a>
86
-
87
- <h4>~SNS Link~</h4>
88
-
89
- <div class="table-responsive">
90
-
91
- <table class="table">
92
-
93
- <tr>
94
-
95
- <td><a href="https://instagram.com/hirotaka612" class="sns">Instagram</a></td>
96
-
97
- <td><a href="https://www.facebook.com/hocuspocusphotographer/" class="sns">Facebook</a></td>
98
-
99
- </tr>
100
-
101
- <tr>
102
-
103
- <td><a href="https://500px.com/hirotaka612" class="sns">500px</a></td>
104
-
105
- <td><a href="https://twitter.com/HocusPocusPhoto" class="sns">Twitter</a></td>
106
-
107
- </tr>
108
-
109
- <tr>
110
-
111
- <td><a href="https://mstdn.tokyocameraclub.com/@HirotakaOriguchi" class="sns">Mstdn</a></td>
112
-
113
- <td></td>
114
-
115
- </tr>
116
-
117
- </table>
118
-
119
- </div>
120
-
121
- </section>
122
-
123
- </div>
124
-
125
-
126
-
127
- <?php get_footer(); ?>
128
-
129
- ```
130
-
131
- 下がHTML変換後のソースです。
132
-
133
- ```html
134
-
135
- <!DOCTYPE html>
136
-
137
- <html>
138
-
139
- <head>
140
-
141
- <meta charset=UTF-8">
142
-
143
- <meta name="description" content="Hirotaka OPriguchiのポートフォリオ">
144
-
145
- <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
146
-
147
- <title>Hocus Pocus</title>
148
-
149
- <link href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/style.css" rel="stylesheet" media="screen">
150
-
151
- <link rel="stylesheet" href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/genericons/genericons.css" type="text/css" />
152
-
153
- <link href="https://fonts.googleapis.com/css?family=Cinzel+Decorative" rel="stylesheet">
154
-
155
- <link href="https://fonts.googleapis.com/css?family=Sorts+Mill+Goudy" rel="stylesheet">
156
-
157
- <script type="text/javascript">
158
-
159
- window._wpemojiSettings = {"baseUrl":"http:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/127.0.0.1:4001\/wordpress\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.2.4"}};
160
-
161
- !function(a,b,c){function d(a){var c=b.createElement("canvas"),d=c.getContext&&c.getContext("2d");return d&&d.fillText?(d.textBaseline="top",d.font="600 32px Arial","flag"===a?(d.fillText(String.fromCharCode(55356,56812,55356,56807),0,0),c.toDataURL().length>3e3):(d.fillText(String.fromCharCode(55357,56835),0,0),0!==d.getImageData(16,16,1,1).data[0])):!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g;c.supports={simple:d("simple"),flag:d("flag")},c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.simple&&c.supports.flag||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
162
-
163
- </script>
164
-
165
- <style type="text/css">
166
-
167
- img.wp-smiley,
168
-
169
- img.emoji {
170
-
171
- display: inline !important;
172
-
173
- border: none !important;
174
-
175
- box-shadow: none !important;
176
-
177
- height: 1em !important;
178
-
179
- width: 1em !important;
180
-
181
- margin: 0 .07em !important;
182
-
183
- vertical-align: -0.1em !important;
184
-
185
- background: none !important;
186
-
187
- padding: 0 !important;
188
-
189
- }
190
-
191
- </style>
192
-
193
- <link rel='stylesheet' id='bootstrap-css-css' href='http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/lib/css/bootstrap.min.css?ver=4.2.4' type='text/css' media='all' />
194
-
195
- <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-includes/js/jquery/jquery.js?ver=1.11.2'></script>
196
-
197
- <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
198
-
199
- <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://127.0.0.1:4001/wordpress/xmlrpc.php?rsd" />
200
-
201
- <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://127.0.0.1:4001/wordpress/wp-includes/wlwmanifest.xml" />
202
-
203
- <meta name="generator" content="WordPress 4.2.4" />
204
-
205
- <link rel="shortcut icon" type="image/x-icon" href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/favicon.ico" />
206
-
207
-
208
-
209
- <script>
210
-
211
- //スムーズスクロール
212
-
213
- jQuery(function(){
214
-
215
- // #で始まるアンカーをクリックした場合に処理
216
-
217
- jQuery('a[href^=#]').click(function() {
218
-
219
- // スクロールの速度
220
-
221
- var speed = 350; // ミリ秒
222
-
223
- // アンカーの値取得
224
-
225
- var href= jQuery(this).attr("href");
226
-
227
- // 移動先を取得
228
-
229
- var target = jQuery(href == "#" || href == "" ? 'html' : href);
230
-
231
- // 移動先を数値で取得
232
-
233
- var position = target.offset().top;
234
-
235
- // スムーズスクロール
236
-
237
- jQuery('body,html').animate({scrollTop:position}, speed, 'swing');
238
-
239
- return false;
240
-
241
- });
242
-
243
- });
244
-
245
- </script>
246
-
247
-
248
-
249
- </head>
250
-
251
- <body>
252
-
253
-
254
-
255
- <div id="header">
256
-
257
- <ul class="nav nav-pills active">
258
-
259
- <li><a href="#contact">Contact</a></li>
260
-
261
- <li><a href="#about">About</a></li>
262
-
263
- <li><a href="#portfolio">Portfolio</a></li>
264
-
265
- </ul>
266
-
267
- </div>
268
-
269
- <section id="top" class="block">
270
-
271
- <div class="col-xs-12">
272
-
273
- <img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/sample.jpg" class="img-responsive">
274
-
275
- <p class="title">Hirotaka Origuchi Photography</p>
276
-
277
- </div>
278
-
279
- </section>
280
-
281
-
282
-
283
- <section id="portfolio" class="block">
284
-
285
- <div class="container">
286
-
287
- <div class="row mainlink">
288
-
289
- <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
290
-
291
- <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
292
-
293
- <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
294
-
295
- <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
296
-
297
- </div>
298
-
299
- </div>
300
-
301
- </section>
302
-
303
-
304
-
305
- <div class="info">
306
-
307
- <section id="about" class="block">
308
-
309
- <h2 class="ab">About</h2>
310
-
311
- <h4>~Hirotaka Origuchi~</h4>
312
-
313
- <p>1995年生まれ、岡山県在住<br>2016年にカメラを始め、同年5月に<a href="https://lovegraph.me/">Lovegraph</a>にジョイン。<br>その夏からポートレート撮影を開始。<br>2017年10月より<br><a href="http://www.studioaim.jp/harajuku.html">creative photostudio aim</a>原宿店に勤務</p>
314
-
315
- <h4>~Equipment~</h4>
316
-
317
- <p>Canon EOS 6D<br>Canon EOS 80D<br>Sigma Art 135mm<br>Sigma Art 30mm<br>iPhone6S</p>
318
-
319
- </section>
320
-
321
-
322
-
323
- <section id="contact" class="block">
324
-
325
- <h2 class="co">Contact</h2>
326
-
327
- <h4>~E-Mail~</h4>
328
-
329
- <a href="mailto:lostsymbol612@gmail.com" class="mail">メールで連絡する</a>
330
-
331
- <h4>~SNS Link~</h4>
332
-
333
- <div class="table-responsive">
334
-
335
- <table class="table">
336
-
337
- <tr>
338
-
339
- <td><a href="https://instagram.com/hirotaka612" class="sns">Instagram</a></td>
340
-
341
- <td><a href="https://www.facebook.com/hocuspocusphotographer/" class="sns">Facebook</a></td>
342
-
343
- </tr>
344
-
345
- <tr>
346
-
347
- <td><a href="https://500px.com/hirotaka612" class="sns">500px</a></td>
348
-
349
- <td><a href="https://twitter.com/HocusPocusPhoto" class="sns">Twitter</a></td>
350
-
351
- </tr>
352
-
353
- <tr>
354
-
355
- <td><a href="https://mstdn.tokyocameraclub.com/@HirotakaOriguchi" class="sns">Mstdn</a></td>
356
-
357
- <td></td>
358
-
359
- </tr>
360
-
361
- </table>
362
-
363
- </div>
364
-
365
- </section>
366
-
367
- </div>
368
-
369
-
370
-
371
- <div id="footer">
372
-
373
- <p class="copy">&copy;2017 Hirotaka Origuchi</p>
374
-
375
- <a class="genericon genericon-collapse" href="#top"></a>
376
-
377
- </div>
378
-
379
- <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/lib/js/bootstrap.min.js?ver=1.0.0'></script>
380
-
381
- </body>
382
-
383
- </html>
384
-
385
- ```
386
-
387
- 現在index.php内で上記のように指定し、
388
-
389
- ページ内リンクを実装しています。
390
-
391
-
392
-
393
- [portfolio]と[contact]のリンクはうまく移動してくれるのですが、
394
-
395
- なぜか[about]だけ動きません。
396
-
397
- 先ほどまでは動いていて、
398
-
399
- フォントの単位指定を変更した後、確認していたら動かなくなっていました。
400
-
401
-
402
-
403
- ※ちなみにブラウザサイズを小さくした時のみ動きません。
404
-
405
-
406
-
407
- ページ内リンクが動かなくなる可能性としてはどんな原因が考えられるのでしょうか?
408
-
409
- よろしくお願いします。
410
-
411
-
412
-
413
- ![イメージ説明](f8a2895f481ef4a85164d12ec8eedd6c.png)

4

情報の追加

2017/05/11 05:38

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -128,7 +128,261 @@
128
128
 
129
129
  ```
130
130
 
131
-
131
+ 下がHTML変換後のソースです。
132
+
133
+ ```html
134
+
135
+ <!DOCTYPE html>
136
+
137
+ <html>
138
+
139
+ <head>
140
+
141
+ <meta charset=UTF-8">
142
+
143
+ <meta name="description" content="Hirotaka OPriguchiのポートフォリオ">
144
+
145
+ <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
146
+
147
+ <title>Hocus Pocus</title>
148
+
149
+ <link href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/style.css" rel="stylesheet" media="screen">
150
+
151
+ <link rel="stylesheet" href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/genericons/genericons.css" type="text/css" />
152
+
153
+ <link href="https://fonts.googleapis.com/css?family=Cinzel+Decorative" rel="stylesheet">
154
+
155
+ <link href="https://fonts.googleapis.com/css?family=Sorts+Mill+Goudy" rel="stylesheet">
156
+
157
+ <script type="text/javascript">
158
+
159
+ window._wpemojiSettings = {"baseUrl":"http:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/127.0.0.1:4001\/wordpress\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.2.4"}};
160
+
161
+ !function(a,b,c){function d(a){var c=b.createElement("canvas"),d=c.getContext&&c.getContext("2d");return d&&d.fillText?(d.textBaseline="top",d.font="600 32px Arial","flag"===a?(d.fillText(String.fromCharCode(55356,56812,55356,56807),0,0),c.toDataURL().length>3e3):(d.fillText(String.fromCharCode(55357,56835),0,0),0!==d.getImageData(16,16,1,1).data[0])):!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g;c.supports={simple:d("simple"),flag:d("flag")},c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.simple&&c.supports.flag||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
162
+
163
+ </script>
164
+
165
+ <style type="text/css">
166
+
167
+ img.wp-smiley,
168
+
169
+ img.emoji {
170
+
171
+ display: inline !important;
172
+
173
+ border: none !important;
174
+
175
+ box-shadow: none !important;
176
+
177
+ height: 1em !important;
178
+
179
+ width: 1em !important;
180
+
181
+ margin: 0 .07em !important;
182
+
183
+ vertical-align: -0.1em !important;
184
+
185
+ background: none !important;
186
+
187
+ padding: 0 !important;
188
+
189
+ }
190
+
191
+ </style>
192
+
193
+ <link rel='stylesheet' id='bootstrap-css-css' href='http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/lib/css/bootstrap.min.css?ver=4.2.4' type='text/css' media='all' />
194
+
195
+ <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-includes/js/jquery/jquery.js?ver=1.11.2'></script>
196
+
197
+ <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
198
+
199
+ <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://127.0.0.1:4001/wordpress/xmlrpc.php?rsd" />
200
+
201
+ <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://127.0.0.1:4001/wordpress/wp-includes/wlwmanifest.xml" />
202
+
203
+ <meta name="generator" content="WordPress 4.2.4" />
204
+
205
+ <link rel="shortcut icon" type="image/x-icon" href="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/favicon.ico" />
206
+
207
+
208
+
209
+ <script>
210
+
211
+ //スムーズスクロール
212
+
213
+ jQuery(function(){
214
+
215
+ // #で始まるアンカーをクリックした場合に処理
216
+
217
+ jQuery('a[href^=#]').click(function() {
218
+
219
+ // スクロールの速度
220
+
221
+ var speed = 350; // ミリ秒
222
+
223
+ // アンカーの値取得
224
+
225
+ var href= jQuery(this).attr("href");
226
+
227
+ // 移動先を取得
228
+
229
+ var target = jQuery(href == "#" || href == "" ? 'html' : href);
230
+
231
+ // 移動先を数値で取得
232
+
233
+ var position = target.offset().top;
234
+
235
+ // スムーズスクロール
236
+
237
+ jQuery('body,html').animate({scrollTop:position}, speed, 'swing');
238
+
239
+ return false;
240
+
241
+ });
242
+
243
+ });
244
+
245
+ </script>
246
+
247
+
248
+
249
+ </head>
250
+
251
+ <body>
252
+
253
+
254
+
255
+ <div id="header">
256
+
257
+ <ul class="nav nav-pills active">
258
+
259
+ <li><a href="#contact">Contact</a></li>
260
+
261
+ <li><a href="#about">About</a></li>
262
+
263
+ <li><a href="#portfolio">Portfolio</a></li>
264
+
265
+ </ul>
266
+
267
+ </div>
268
+
269
+ <section id="top" class="block">
270
+
271
+ <div class="col-xs-12">
272
+
273
+ <img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/sample.jpg" class="img-responsive">
274
+
275
+ <p class="title">Hirotaka Origuchi Photography</p>
276
+
277
+ </div>
278
+
279
+ </section>
280
+
281
+
282
+
283
+ <section id="portfolio" class="block">
284
+
285
+ <div class="container">
286
+
287
+ <div class="row mainlink">
288
+
289
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
290
+
291
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
292
+
293
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
294
+
295
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/img/test.jpg"></a></div>
296
+
297
+ </div>
298
+
299
+ </div>
300
+
301
+ </section>
302
+
303
+
304
+
305
+ <div class="info">
306
+
307
+ <section id="about" class="block">
308
+
309
+ <h2 class="ab">About</h2>
310
+
311
+ <h4>~Hirotaka Origuchi~</h4>
312
+
313
+ <p>1995年生まれ、岡山県在住<br>2016年にカメラを始め、同年5月に<a href="https://lovegraph.me/">Lovegraph</a>にジョイン。<br>その夏からポートレート撮影を開始。<br>2017年10月より<br><a href="http://www.studioaim.jp/harajuku.html">creative photostudio aim</a>原宿店に勤務</p>
314
+
315
+ <h4>~Equipment~</h4>
316
+
317
+ <p>Canon EOS 6D<br>Canon EOS 80D<br>Sigma Art 135mm<br>Sigma Art 30mm<br>iPhone6S</p>
318
+
319
+ </section>
320
+
321
+
322
+
323
+ <section id="contact" class="block">
324
+
325
+ <h2 class="co">Contact</h2>
326
+
327
+ <h4>~E-Mail~</h4>
328
+
329
+ <a href="mailto:lostsymbol612@gmail.com" class="mail">メールで連絡する</a>
330
+
331
+ <h4>~SNS Link~</h4>
332
+
333
+ <div class="table-responsive">
334
+
335
+ <table class="table">
336
+
337
+ <tr>
338
+
339
+ <td><a href="https://instagram.com/hirotaka612" class="sns">Instagram</a></td>
340
+
341
+ <td><a href="https://www.facebook.com/hocuspocusphotographer/" class="sns">Facebook</a></td>
342
+
343
+ </tr>
344
+
345
+ <tr>
346
+
347
+ <td><a href="https://500px.com/hirotaka612" class="sns">500px</a></td>
348
+
349
+ <td><a href="https://twitter.com/HocusPocusPhoto" class="sns">Twitter</a></td>
350
+
351
+ </tr>
352
+
353
+ <tr>
354
+
355
+ <td><a href="https://mstdn.tokyocameraclub.com/@HirotakaOriguchi" class="sns">Mstdn</a></td>
356
+
357
+ <td></td>
358
+
359
+ </tr>
360
+
361
+ </table>
362
+
363
+ </div>
364
+
365
+ </section>
366
+
367
+ </div>
368
+
369
+
370
+
371
+ <div id="footer">
372
+
373
+ <p class="copy">&copy;2017 Hirotaka Origuchi</p>
374
+
375
+ <a class="genericon genericon-collapse" href="#top"></a>
376
+
377
+ </div>
378
+
379
+ <script type='text/javascript' src='http://127.0.0.1:4001/wordpress/wp-content/themes/UnderDevelopment/lib/js/bootstrap.min.js?ver=1.0.0'></script>
380
+
381
+ </body>
382
+
383
+ </html>
384
+
385
+ ```
132
386
 
133
387
  現在index.php内で上記のように指定し、
134
388
 

3

情報の追加

2017/05/11 03:42

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -16,23 +16,115 @@
16
16
 
17
17
 
18
18
 
19
- ```html
19
+ ```php
20
20
 
21
- <section id="portfolio">
21
+ <?php get_header(); ?>
22
22
 
23
- </section>
23
+
24
24
 
25
- ...
25
+ <section id="top" class="block">
26
26
 
27
- <section id="about">
27
+ <div class="col-xs-12">
28
28
 
29
- </section>
29
+ <img src="<?php echo get_template_directory_uri(); ?>/img/sample.jpg" class="img-responsive">
30
30
 
31
- ...
31
+ <p class="title">Hirotaka Origuchi Photography</p>
32
32
 
33
- <section id="contact">
33
+ </div>
34
34
 
35
- </section>
35
+ </section>
36
+
37
+
38
+
39
+ <section id="portfolio" class="block">
40
+
41
+ <div class="container">
42
+
43
+ <div class="row mainlink">
44
+
45
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
46
+
47
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
48
+
49
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
50
+
51
+ <div class="col-md-6 col-xs-12"><a href="#"><img src="<?php echo get_template_directory_uri(); ?>/img/test.jpg"></a></div>
52
+
53
+ </div>
54
+
55
+ </div>
56
+
57
+ </section>
58
+
59
+
60
+
61
+ <div class="info">
62
+
63
+ <section id="about" class="block">
64
+
65
+ <h2 class="ab">About</h2>
66
+
67
+ <h4>~Hirotaka Origuchi~</h4>
68
+
69
+ <p>1995年生まれ、岡山県在住<br>2016年にカメラを始め、同年5月に<a href="https://lovegraph.me/">Lovegraph</a>にジョイン。<br>その夏からポートレート撮影を開始。<br>2017年10月より<br><a href="http://www.studioaim.jp/harajuku.html">creative photostudio aim</a>原宿店に勤務</p>
70
+
71
+ <h4>~Equipment~</h4>
72
+
73
+ <p>Canon EOS 6D<br>Canon EOS 80D<br>Sigma Art 135mm<br>Sigma Art 30mm<br>iPhone6S</p>
74
+
75
+ </section>
76
+
77
+
78
+
79
+ <section id="contact" class="block">
80
+
81
+ <h2 class="co">Contact</h2>
82
+
83
+ <h4>~E-Mail~</h4>
84
+
85
+ <a href="mailto:lostsymbol612@gmail.com" class="mail">メールで連絡する</a>
86
+
87
+ <h4>~SNS Link~</h4>
88
+
89
+ <div class="table-responsive">
90
+
91
+ <table class="table">
92
+
93
+ <tr>
94
+
95
+ <td><a href="https://instagram.com/hirotaka612" class="sns">Instagram</a></td>
96
+
97
+ <td><a href="https://www.facebook.com/hocuspocusphotographer/" class="sns">Facebook</a></td>
98
+
99
+ </tr>
100
+
101
+ <tr>
102
+
103
+ <td><a href="https://500px.com/hirotaka612" class="sns">500px</a></td>
104
+
105
+ <td><a href="https://twitter.com/HocusPocusPhoto" class="sns">Twitter</a></td>
106
+
107
+ </tr>
108
+
109
+ <tr>
110
+
111
+ <td><a href="https://mstdn.tokyocameraclub.com/@HirotakaOriguchi" class="sns">Mstdn</a></td>
112
+
113
+ <td></td>
114
+
115
+ </tr>
116
+
117
+ </table>
118
+
119
+ </div>
120
+
121
+ </section>
122
+
123
+ </div>
124
+
125
+
126
+
127
+ <?php get_footer(); ?>
36
128
 
37
129
  ```
38
130
 

2

情報の追加

2017/05/11 03:23

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -1,4 +1,4 @@
1
- #困っている
1
+ #困っていること
2
2
 
3
3
  ```html
4
4
 
@@ -61,3 +61,7 @@
61
61
  ページ内リンクが動かなくなる可能性としてはどんな原因が考えられるのでしょうか?
62
62
 
63
63
  よろしくお願いします。
64
+
65
+
66
+
67
+ ![イメージ説明](f8a2895f481ef4a85164d12ec8eedd6c.png)

1

情報の追加

2017/05/11 02:58

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -48,9 +48,13 @@
48
48
 
49
49
  なぜか[about]だけ動きません。
50
50
 
51
- ちなみに先ほどまでは動いていて、
51
+ 先ほどまでは動いていて、
52
52
 
53
53
  フォントの単位指定を変更した後、確認していたら動かなくなっていました。
54
+
55
+
56
+
57
+ ※ちなみにブラウザサイズを小さくした時のみ動きません。
54
58
 
55
59
 
56
60