質問編集履歴
2
ソースの追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -38,27 +38,143 @@
|
|
|
38
38
|
|
|
39
39
|
|
|
40
40
|
|
|
41
|
-
|
|
41
|
+
親ページのソースおよびiframe内のソースが下記となります。
|
|
42
|
-
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
|
|
43
|
-
|
|
45
|
+
親ページのソース
|
|
44
|
-
|
|
45
|
-
|
|
46
46
|
|
|
47
47
|
```ここに言語を入力
|
|
48
48
|
|
|
49
|
+
<!DOCTYPE html>
|
|
50
|
+
|
|
51
|
+
<html lang="ja">
|
|
52
|
+
|
|
53
|
+
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#">
|
|
54
|
+
|
|
55
|
+
<!--中略-->
|
|
56
|
+
|
|
57
|
+
<link rel="stylesheet" href="assets/css/base.css">
|
|
58
|
+
|
|
59
|
+
<link rel="stylesheet" href="assets/css/form.css">
|
|
60
|
+
|
|
61
|
+
<link rel="icon" href="http://140.227.39.204/~work260/favicon.ico">
|
|
62
|
+
|
|
63
|
+
<link rel="apple-touch-icon" href="http://140.227.39.204/~work260/assets/img/apple-touch-icon.png">
|
|
64
|
+
|
|
65
|
+
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
|
|
66
|
+
|
|
67
|
+
<link href="https://fonts.googleapis.com/css?family=Lora" rel="stylesheet">
|
|
68
|
+
|
|
69
|
+
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
|
|
70
|
+
|
|
71
|
+
</head>
|
|
72
|
+
|
|
73
|
+
<body id="page72" class="normal">
|
|
74
|
+
|
|
75
|
+
<header><!--中略--></header>
|
|
76
|
+
|
|
77
|
+
<main id="wrapper">
|
|
78
|
+
|
|
79
|
+
<article>
|
|
80
|
+
|
|
81
|
+
<section id="wide"><h2 class="wf4 cbc">お問合せ</h2></section>
|
|
82
|
+
|
|
83
|
+
<section id="contents" class="clearfix">
|
|
84
|
+
|
|
85
|
+
<div id="mainArea" class="clearfix">
|
|
86
|
+
|
|
87
|
+
<div id="fbox">
|
|
88
|
+
|
|
89
|
+
<div class="toiawaseTopBox"><p class="tfLink"><a href="#tel_fax" class="pt">電話をご利用の方はこちら</a></p></div>
|
|
90
|
+
|
|
91
|
+
<div><iframe id="iframe" src="http://140.227.39.204/~work260/cgi-bin/toiawase/form.cgi?trackerId=&siteId="></iframe></div>
|
|
92
|
+
|
|
93
|
+
<a name="tel_fax" id="tel_fax"></a>
|
|
94
|
+
|
|
95
|
+
<div class="tfBox"><dl class="bdt solid bl clearfix"><dt class="wf2 bc2">電話でのお問合せ</dt><dd><div class="fst wf3 tbc"><span class="tit">TEL.</span><a class="number" href="tel:0120-123-456" id="form_tel">0120-123-456</a></div><div class="lst">[営業時間] 10:00～19:00<br>[定休日] 日曜日</div></dd></dl></div>
|
|
96
|
+
|
|
97
|
+
</div>
|
|
98
|
+
|
|
99
|
+
</div>
|
|
100
|
+
|
|
101
|
+
</section>
|
|
102
|
+
|
|
103
|
+
</article>
|
|
104
|
+
|
|
105
|
+
</main>
|
|
106
|
+
|
|
107
|
+
<footer class="wbg bl">
|
|
108
|
+
|
|
109
|
+
<!--中略-->
|
|
110
|
+
|
|
111
|
+
</footer>
|
|
112
|
+
|
|
113
|
+
<script src="assets/js/jquery.flexnav.js"></script>
|
|
114
|
+
|
|
115
|
+
<script src="assets/js/jquery.smoothScroll.js"></script>
|
|
116
|
+
|
|
117
|
+
<script src="assets/js/lightbox-2.6.min.js"></script>
|
|
118
|
+
|
|
119
|
+
<script src="assets/js/pager.js" defer></script>
|
|
120
|
+
|
|
121
|
+
<script defer>
|
|
122
|
+
|
|
123
|
+
jQuery(document).ready(function($){$(".navi_p").flexNav();});
|
|
124
|
+
|
|
125
|
+
$(function(){
|
|
126
|
+
|
|
127
|
+
var topBtn=$('#pageTop');
|
|
128
|
+
|
|
129
|
+
var obj=$('#iframe');
|
|
130
|
+
|
|
131
|
+
var tf=$('#tel_fax');
|
|
132
|
+
|
|
133
|
+
topBtn.hide();
|
|
134
|
+
|
|
135
|
+
$(window).scroll(function(){if($(this).scrollTop()> 100){topBtn.fadeIn();}else{topBtn.fadeOut();};});
|
|
136
|
+
|
|
137
|
+
tf.click(function(){
|
|
138
|
+
|
|
139
|
+
var speed = 500;
|
|
140
|
+
|
|
141
|
+
var href= $(this).attr("href");
|
|
142
|
+
|
|
143
|
+
var target = $(href == "#" || href == "" ? 'html' : href);
|
|
144
|
+
|
|
145
|
+
var position = target.offset().top;
|
|
146
|
+
|
|
147
|
+
$("html, body").animate({scrollTop:position}, speed, "swing");
|
|
148
|
+
|
|
149
|
+
return false;
|
|
150
|
+
|
|
151
|
+
});
|
|
152
|
+
|
|
153
|
+
topBtn.click(function(){$('body,html').animate({scrollTop: 0},1000);return false;});
|
|
154
|
+
|
|
155
|
+
obj.on('load',function(){var off=$('body').offset();$('body,html').animate({scrollTop: off.top,scrollLeft: off.left},0);});
|
|
156
|
+
|
|
157
|
+
$(window).on("scroll touchmove", function(){
|
|
158
|
+
|
|
159
|
+
$("#footer_link").stop();
|
|
160
|
+
|
|
161
|
+
$("#footer_link").css('display', 'none').delay(300).fadeIn(500);
|
|
162
|
+
|
|
163
|
+
});
|
|
164
|
+
|
|
165
|
+
});
|
|
166
|
+
|
|
167
|
+
</script>
|
|
168
|
+
|
|
49
169
|
<script>
|
|
50
170
|
|
|
51
171
|
$(function(){
|
|
52
172
|
|
|
53
173
|
$(window).on('beforeunload', function(){return ""; });
|
|
54
174
|
|
|
55
|
-
//$('iframe').submit'((window).off('beforeunload'););
|
|
175
|
+
//$('iframe').submit'((window).off('beforeunload'););
|
|
56
|
-
|
|
176
|
+
|
|
57
|
-
//$('iframe').on('submit',function(){$(window).off('beforeunload');});
|
|
177
|
+
//$('iframe').on('submit',function(){$(window).off('beforeunload');});
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
// iframeの高さ
|
|
62
178
|
|
|
63
179
|
var frm = document.getElementById("iframe");
|
|
64
180
|
|
|
@@ -76,8 +192,196 @@
|
|
|
76
192
|
|
|
77
193
|
});
|
|
78
194
|
|
|
79
|
-
|
|
80
|
-
|
|
81
195
|
</script>
|
|
82
196
|
|
|
197
|
+
<script type="text/javascript" src="//webfont.fontplus.jp/accessor/script/fontplus.js?BgLtZoOyUF4%3D&aa=1&ab=2" charset="utf-8"></script>
|
|
198
|
+
|
|
199
|
+
</body>
|
|
200
|
+
|
|
201
|
+
</html>
|
|
202
|
+
|
|
83
203
|
```
|
|
204
|
+
|
|
205
|
+
|
|
206
|
+
|
|
207
|
+
iframe内のソース（入力画面）
|
|
208
|
+
|
|
209
|
+
```ここに言語を入力
|
|
210
|
+
|
|
211
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
212
|
+
|
|
213
|
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
|
|
214
|
+
|
|
215
|
+
<head>
|
|
216
|
+
|
|
217
|
+
<title>入力画面</title>
|
|
218
|
+
|
|
219
|
+
<!--中略-->
|
|
220
|
+
|
|
221
|
+
<link rel="stylesheet" href="../css/base.css" type="text/css" />
|
|
222
|
+
|
|
223
|
+
<script type="text/javascript" src="../js/jquery-2.1.3.js"></script>
|
|
224
|
+
|
|
225
|
+
<script type="text/javascript" src="../js/jquery.autoKana.js"></script>
|
|
226
|
+
|
|
227
|
+
<script type="text/javascript" src="//ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>
|
|
228
|
+
|
|
229
|
+
<script type="text/javascript" src="./static/js/form.js"></script>
|
|
230
|
+
|
|
231
|
+
<script>
|
|
232
|
+
|
|
233
|
+
window.onload = function () {
|
|
234
|
+
|
|
235
|
+
document.getElementById("zip").onkeyup = function(){AjaxZip3.zip2addr(this,'','address','address');};
|
|
236
|
+
|
|
237
|
+
// 姓名 (katakana : true カタカナ / false : ひらがな)
|
|
238
|
+
|
|
239
|
+
$.fn.autoKana( "input[name='name']", "input[name='kana']", {katakana : true});
|
|
240
|
+
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
</script>
|
|
244
|
+
|
|
245
|
+
</head>
|
|
246
|
+
|
|
247
|
+
<body>
|
|
248
|
+
|
|
249
|
+
<div id="form_box">
|
|
250
|
+
|
|
251
|
+
<ul id="top_box">
|
|
252
|
+
|
|
253
|
+
<li class="on"><span class="css3">STEP 1</span><br><span class="pc_txt">必要事項の</span><span class="sp_txt">入力</span></li>
|
|
254
|
+
|
|
255
|
+
<li><span class="css3">STEP 2</span><br><span class="pc_txt">入力内容の</span><span class="sp_txt">確認</span></li>
|
|
256
|
+
|
|
257
|
+
<li class="lst"><span class="css3">STEP 3</span><br><span class="pc_txt">送信</span><span class="sp_txt">完了</span></li>
|
|
258
|
+
|
|
259
|
+
</ul>
|
|
260
|
+
|
|
261
|
+
<div id="form_main">
|
|
262
|
+
|
|
263
|
+
<form action="/~work260/cgi-bin/toiawase/form.cgi#form_box" method="post">
|
|
264
|
+
|
|
265
|
+
<input type="hidden" name="pid" value="6357390f8afd27beab7d40cb12efaaf1" /><input type="hidden" name="m" value="cfmsmt" />
|
|
266
|
+
|
|
267
|
+
<dl><dt><b class="nortice">必須</b><p class="">お問合せ区分</p></dt><dd><label for="type_1"><input type="radio" name="type" id="type_1" value="ご相談" class="radio " /> ご相談</label><label for="type_2"><input type="radio" name="type" id="type_2" value="お見積り" class="radio " /> お見積り</label><label for="type_3"><input type="radio" name="type" id="type_3" value="その他" class="radio " /> その他</label></dd></dl>
|
|
268
|
+
|
|
269
|
+
<dl><dt><b class="nortice">必須</b><p class="">お名前</p></dt><dd><input type="text" name="name" id="name" value="" maxlength="255" style="width:100%" class="text " /></dd></dl>
|
|
270
|
+
|
|
271
|
+
<dl><dt><b class="nortice">必須</b><p class="">フリガナ</p></dt><dd><input type="text" name="kana" id="kana" value="" maxlength="255" style="width:100%" class="text " /></dd></dl>
|
|
272
|
+
|
|
273
|
+
<dl><dt><b class="option">任意</b><p class="">参加日</p></dt><dd><input type="text" name="date" id="date" value="" maxlength="255" style="width:100%" class="text " /></dd></dl>
|
|
274
|
+
|
|
275
|
+
<dl><dt><b class="nortice">必須</b><p class="">郵便番号</p></dt><dd><input type="text" name="zip" id="zip" value="" maxlength="8" style="width:100px" class="text " /></dd></dl>
|
|
276
|
+
|
|
277
|
+
<dl><dt><b class="nortice">必須</b><p class="">ご住所</p></dt><dd><input type="text" name="address" id="address" value="" maxlength="255" style="width:100%" class="text " /></dd></dl>
|
|
278
|
+
|
|
279
|
+
<dl><dt><b class="nortice">必須</b><p class="">E-mail</p></dt><dd><p class="desc">携帯メール可</p><input type="text" name="email" id="email" value="" maxlength="255" style="width:100%" class="text " /></dd></dl>
|
|
280
|
+
|
|
281
|
+
<dl><dt><b class="nortice">必須</b><p class="">電話番号</p></dt><dd><p class="desc">携帯電話も可</p><input type="text" name="tel" id="tel" value="" maxlength="14" style="width:100%" class="text " /></dd></dl>
|
|
282
|
+
|
|
283
|
+
<dl><dt><b class="nortice">必須</b><p class="">お問合せ内容</p></dt><dd><textarea name="comment" id="comment" cols="40" rows="3" class="textarea "></textarea></dd></dl>
|
|
284
|
+
|
|
285
|
+
<div class="btn"><input type="submit" value="確認画面へ" class="submit" /></div>
|
|
286
|
+
|
|
287
|
+
</form>
|
|
288
|
+
|
|
289
|
+
</div>
|
|
290
|
+
|
|
291
|
+
</div>
|
|
292
|
+
|
|
293
|
+
<script type="text/javascript">
|
|
294
|
+
|
|
295
|
+
$('#date').attr('type','date');
|
|
296
|
+
|
|
297
|
+
$('#email').attr('type','email');
|
|
298
|
+
|
|
299
|
+
$('#tel').attr('type','tel');
|
|
300
|
+
|
|
301
|
+
$('#fax').attr('type','tel');
|
|
302
|
+
|
|
303
|
+
</script>
|
|
304
|
+
|
|
305
|
+
</body>
|
|
306
|
+
|
|
307
|
+
</html>
|
|
308
|
+
|
|
309
|
+
```
|
|
310
|
+
|
|
311
|
+
|
|
312
|
+
|
|
313
|
+
iframe内のソース（確認画面）
|
|
314
|
+
|
|
315
|
+
```ここに言語を入力
|
|
316
|
+
|
|
317
|
+
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
|
318
|
+
|
|
319
|
+
<html>
|
|
320
|
+
|
|
321
|
+
<head>
|
|
322
|
+
|
|
323
|
+
<title>メールフォーム：確認画面</title>
|
|
324
|
+
|
|
325
|
+
<!--中略-->
|
|
326
|
+
|
|
327
|
+
<link rel="stylesheet" href="../css/base.css" type="text/css">
|
|
328
|
+
|
|
329
|
+
<script type="text/javascript" src="./static/js/form.js"></script>
|
|
330
|
+
|
|
331
|
+
</head>
|
|
332
|
+
|
|
333
|
+
<body>
|
|
334
|
+
|
|
335
|
+
<div id="form_box">
|
|
336
|
+
|
|
337
|
+
<ul id="top_box">
|
|
338
|
+
|
|
339
|
+
<li><span class="css3">STEP 1</span><br><span class="pc_txt">必要事項の</span><span class="sp_txt">入力</span></li>
|
|
340
|
+
|
|
341
|
+
<li class="on"><span class="css3">STEP 2</span><br><span class="pc_txt">入力内容の</span><span class="sp_txt">確認</span></li>
|
|
342
|
+
|
|
343
|
+
<li class="lst"><span class="css3">STEP 3</span><br><span class="pc_txt">送信</span><span class="sp_txt">完了</span></li>
|
|
344
|
+
|
|
345
|
+
</ul>
|
|
346
|
+
|
|
347
|
+
<p class="art">下記の内容で送信いたします。<br>入力内容に間違いがなければ、下の送信ボタンをクリックしてください。</p>
|
|
348
|
+
|
|
349
|
+
<form action="/~work260/cgi-bin/toiawase/form.cgi" method="post">
|
|
350
|
+
|
|
351
|
+
<div id="form_main">
|
|
352
|
+
|
|
353
|
+
<input type="hidden" name="pid" value="e6897872edd8d5f0aff7a057e1e9a34f" /><input type="hidden" name="m" value="cptsmt" />
|
|
354
|
+
|
|
355
|
+
<dl><dt><b class="nortice">必須</b><p>お問合せ区分</p></dt><dd class="bg_f">ご相談</dd></dl>
|
|
356
|
+
|
|
357
|
+
<dl><dt><b class="nortice">必須</b><p>お名前</p></dt><dd class="bg_f">お名前</dd></dl>
|
|
358
|
+
|
|
359
|
+
<dl><dt><b class="nortice">必須</b><p>フリガナ</p></dt><dd class="bg_f">フリガナ</dd></dl>
|
|
360
|
+
|
|
361
|
+
<dl><dt><b class="option">任意</b><p>参加日</p></dt><dd class="bg_f">2019-08-09</dd></dl>
|
|
362
|
+
|
|
363
|
+
<dl><dt><b class="nortice">必須</b><p>郵便番号</p></dt><dd class="bg_f">6000000</dd></dl>
|
|
364
|
+
|
|
365
|
+
<dl><dt><b class="nortice">必須</b><p>ご住所</p></dt><dd class="bg_f">京都府京都市下京区</dd></dl>
|
|
366
|
+
|
|
367
|
+
<dl><dt><b class="nortice">必須</b><p>E-mail</p></dt><dd class="bg_f">sample@hoge.gom</dd></dl>
|
|
368
|
+
|
|
369
|
+
<dl><dt><b class="nortice">必須</b><p>電話番号</p></dt><dd class="bg_f">09090909090</dd></dl>
|
|
370
|
+
|
|
371
|
+
<dl><dt><b class="nortice">必須</b><p>お問合せ内容</p></dt><dd class="bg_f">お問合せ内容</dd></dl>
|
|
372
|
+
|
|
373
|
+
</div>
|
|
374
|
+
|
|
375
|
+
<p class="comment">※送信完了までに時間がかかる場合がございます。<br>送信完了画面が表示されるまでしばらくお待ちください。</p>
|
|
376
|
+
|
|
377
|
+
<div class="btn"><input type="button" value="戻る" onclick="javascript:document.location.href='http://140.227.39.204/~work260/cgi-bin/toiawase/form.cgi?m=frmshw&pid=e6897872edd8d5f0aff7a057e1e9a34f'" class="submit" /><input type="submit" value="送信" class="submit" /></div>
|
|
378
|
+
|
|
379
|
+
</form>
|
|
380
|
+
|
|
381
|
+
</div>
|
|
382
|
+
|
|
383
|
+
</body>
|
|
384
|
+
|
|
385
|
+
</html>
|
|
386
|
+
|
|
387
|
+
```
|
1
コードの追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -35,3 +35,49 @@
|
|
|
35
35
|
■参考にしたページ
|
|
36
36
|
|
|
37
37
|
https://qiita.com/dolaemoso/items/fd05c101e7e190070059
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
javascriptのコードを追記いたします。
|
|
42
|
+
|
|
43
|
+
ただ、どうやったら動作するかわからずコメントアウトしています。
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
```ここに言語を入力
|
|
48
|
+
|
|
49
|
+
<script>
|
|
50
|
+
|
|
51
|
+
$(function(){
|
|
52
|
+
|
|
53
|
+
$(window).on('beforeunload', function(){return ""; });
|
|
54
|
+
|
|
55
|
+
//$('iframe').submit'((window).off('beforeunload');); //動作しないのでコメントアウト
|
|
56
|
+
|
|
57
|
+
//$('iframe').on('submit',function(){$(window).off('beforeunload');}); //動作しないのでコメントアウト
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
// iframeの高さ
|
|
62
|
+
|
|
63
|
+
var frm = document.getElementById("iframe");
|
|
64
|
+
|
|
65
|
+
if(!frm){frm = document.getElementById("contact");}
|
|
66
|
+
|
|
67
|
+
if(frm){
|
|
68
|
+
|
|
69
|
+
$(window).on('resize', function(){frameHeight();});
|
|
70
|
+
|
|
71
|
+
$(frm).load(function(){frameHeight();});
|
|
72
|
+
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
function frameHeight(){$(frm).height(frm.contentWindow.document.body.scrollHeight+100);}
|
|
76
|
+
|
|
77
|
+
});
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
</script>
|
|
82
|
+
|
|
83
|
+
```
|