質問編集履歴
3
書式の改善
title
CHANGED
File without changes
|
body
CHANGED
@@ -11,7 +11,7 @@
|
|
11
11
|
<html lang="ja">
|
12
12
|
<head>
|
13
13
|
<meta charset="utf-8" />
|
14
|
-
<title>
|
14
|
+
<title></title>
|
15
15
|
<meta name="description" content="" />
|
16
16
|
<meta name="keywords" content="" />
|
17
17
|
|
2
内容の修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -7,11 +7,125 @@
|
|
7
7
|
|
8
8
|
ソース
|
9
9
|
```
|
10
|
+
<!DOCTYPE html>
|
11
|
+
<html lang="ja">
|
12
|
+
<head>
|
13
|
+
<meta charset="utf-8" />
|
14
|
+
<title>よつば接骨院 草津店</title>
|
15
|
+
<meta name="description" content="" />
|
16
|
+
<meta name="keywords" content="" />
|
17
|
+
|
18
|
+
<link rel="stylesheet" href="css/style.css" />
|
19
|
+
<link rel="stylesheet" href="css/animate.css" />
|
20
|
+
<link rel="stylesheet" href="css/jquery.fullPage.css" />
|
21
|
+
<!-- <link rel="stylesheet" href="css/examples.css" />-->
|
22
|
+
<style>
|
23
|
+
|
24
|
+
/* Style for our header texts
|
25
|
+
* --------------------------------------- */
|
26
|
+
h1{
|
27
|
+
font-size: 5em;
|
28
|
+
font-family: arial,helvetica;
|
29
|
+
color: #fff;
|
30
|
+
margin:0;
|
31
|
+
}
|
32
|
+
|
33
|
+
/* Centered texts in each section
|
34
|
+
* --------------------------------------- */
|
35
|
+
.section{
|
36
|
+
text-align:center;
|
37
|
+
}
|
38
|
+
|
39
|
+
/* Overwriting styles for control arrows for slides
|
40
|
+
* --------------------------------------- */
|
41
|
+
.controlArrow.prev {
|
42
|
+
left: 50px;
|
43
|
+
}
|
44
|
+
.controlArrow.next{
|
45
|
+
right: 50px;
|
46
|
+
}
|
47
|
+
|
48
|
+
|
49
|
+
/* Bottom menu
|
50
|
+
* --------------------------------------- */
|
51
|
+
#infoMenu li a {
|
52
|
+
color: #fff;
|
53
|
+
}
|
54
|
+
</style>
|
55
|
+
|
56
|
+
<!--[if IE]>
|
57
|
+
<script type="text/javascript">
|
58
|
+
var console = { log: function() {} };
|
59
|
+
</script>
|
60
|
+
<![endif]-->
|
61
|
+
|
62
|
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
63
|
+
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
|
64
|
+
|
65
|
+
<script src="js/jquery.slimscroll.min.js"></script>
|
66
|
+
|
67
|
+
<script src="js/jquery.fullPage.js"></script>
|
68
|
+
<!-- <script type="text/javascript" src="js/examples.js"></script>-->
|
10
69
|
<script src="js/wow.js"></script>
|
11
70
|
<script>
|
12
71
|
new WOW().init();
|
13
72
|
</script>
|
73
|
+
<script>
|
74
|
+
$(document).ready(function() {
|
14
|
-
|
75
|
+
$('#fullpage').fullpage({
|
76
|
+
//anchors: ['1stPage', '2ndPage', '3rdPage', '4thPage', '5thPage'],
|
77
|
+
//sectionsColor: ['#C63D0F', '#1BBC9B', '#7E8F7C'],
|
78
|
+
navigation: true,
|
79
|
+
navigationPosition: 'right',
|
80
|
+
navigationTooltips: ['First page', 'Second page', 'Third page', 'Fourth page', 'Fifth page']
|
81
|
+
});
|
82
|
+
});
|
83
|
+
</script>
|
84
|
+
|
85
|
+
</head>
|
86
|
+
<body>
|
87
|
+
|
88
|
+
<div id="fullpage">
|
89
|
+
<div class="section " id="section0">
|
90
|
+
<div class="intro">
|
91
|
+
<div class="con_r">
|
92
|
+
<div class="sec0_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="3.5s"><img src="img/txt01.png" width="398" height="43"></div>
|
93
|
+
<div class="sec0_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="4s"><img src="img/txt02.png" width="412" height="236"></div>
|
94
|
+
<div class="sec0_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="4.5s"><img src="img/txt03.png" width="221" height="24"></div>
|
95
|
+
</div>
|
96
|
+
</div>
|
97
|
+
</div>
|
98
|
+
<div class="section" id="section1">
|
99
|
+
<div class="intro">
|
100
|
+
<div class="sec1_pic01"><img src="img/campaign.png" width="870" height="160"></div>
|
101
|
+
<table>
|
102
|
+
<tr>
|
103
|
+
<td>施術メニュー</td>
|
104
|
+
<td>料金(税込)</td>
|
105
|
+
<td>時間</td>
|
106
|
+
<td>備考</td>
|
107
|
+
</tr>
|
108
|
+
<tr>
|
109
|
+
<td>マッサージ</td>
|
110
|
+
<td>\800</td>
|
111
|
+
<td>10分</td>
|
112
|
+
<td>10分延長ごとに+\800</td>
|
113
|
+
</tr>
|
114
|
+
<tr>
|
115
|
+
<td>IDストレッチ</td>
|
116
|
+
<td>\1,200</td>
|
117
|
+
<td>15分</td>
|
118
|
+
<td>15分延長ごとに+\1,200</td>
|
119
|
+
</tr>
|
120
|
+
<tr>
|
121
|
+
<td>骨盤矯正</td>
|
122
|
+
<td>\3,000</td>
|
123
|
+
<td>20分</td>
|
124
|
+
<td>お得な5回パックで\12,000</td>
|
125
|
+
</tr>
|
126
|
+
</table>
|
127
|
+
</div>
|
128
|
+
</div>
|
15
129
|
<div class="section" id="section2">
|
16
130
|
<div class="intro">
|
17
131
|
<div class="sec2_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="1s">
|
@@ -20,10 +134,74 @@
|
|
20
134
|
</div>
|
21
135
|
</div>
|
22
136
|
</div>
|
137
|
+
<div class="section" id="section3">
|
138
|
+
<div class="intro">
|
139
|
+
<h1><img src="img/section03_txt01.png" width="550" height="73"></h1>
|
140
|
+
<p>私たちは、あなたのキレイのために、トレーニングの合間に休憩していただくスペースは快適にくつろいでいただけるよう拘っています。</p>
|
141
|
+
</div>
|
142
|
+
</div>
|
143
|
+
<div class="section" id="section4">
|
144
|
+
<div class="intro">
|
145
|
+
<h1>Enjoy it</h1>
|
146
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
147
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
148
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
149
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
150
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
151
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
152
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
153
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
154
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
155
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
156
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
157
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
158
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
159
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
160
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
161
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
162
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
163
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
164
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
165
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
166
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
167
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
168
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
169
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
170
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
171
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
172
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
173
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
174
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
175
|
+
<p>An easy and beautiful way to navigate throw the sections</p>
|
176
|
+
</div>
|
177
|
+
</div>
|
178
|
+
</div>
|
23
179
|
|
180
|
+
|
181
|
+
</body>
|
182
|
+
</html>
|
24
183
|
```
|
25
184
|
追加したcss
|
26
185
|
```
|
186
|
+
@charset "utf-8";
|
187
|
+
/* CSS Document */
|
188
|
+
|
189
|
+
#section0 {
|
190
|
+
width:100%;
|
191
|
+
height:100%;
|
192
|
+
background-image:url(../img/top.gif);
|
193
|
+
background-position: 50% 50%;
|
194
|
+
background-size: cover; /* 背景画像をフルスクリーン表示 */
|
195
|
+
}
|
196
|
+
|
197
|
+
.con_r {
|
198
|
+
margin: 0 0 0 50%;
|
199
|
+
}
|
200
|
+
|
201
|
+
.sec0_txt01 {
|
202
|
+
margin: 0 0 20px 0;
|
203
|
+
}
|
204
|
+
|
27
205
|
#section2 {
|
28
206
|
width:100%;
|
29
207
|
height:100%;
|
1
内容の修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -3,57 +3,27 @@
|
|
3
3
|
参考サイトがたくさんあり、それを見てやっているんですが、上手くいきません。
|
4
4
|
教えていただけないでしょうか?
|
5
5
|
|
6
|
+
3ページ目の<div class="sec2_txt01">が動きません。
|
7
|
+
|
8
|
+
ソース
|
6
9
|
```
|
7
|
-
ソース
|
8
|
-
|
10
|
+
<script src="js/wow.js"></script>
|
9
|
-
<div class="intro">
|
10
|
-
|
11
|
+
<script>
|
11
|
-
|
12
|
+
new WOW().init();
|
12
|
-
<div class="sec0_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="4s"><img src="img/txt02.png" width="412" height="236"></div>
|
13
|
-
<div class="sec0_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="4.5s"><img src="img/txt03.png" width="221" height="24"></div>
|
14
|
-
|
13
|
+
</script>
|
15
|
-
</div>
|
16
|
-
</div>
|
17
|
-
<div class="section" id="section1">
|
18
|
-
<div class="slide" id="slide1">
|
19
|
-
|
14
|
+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
20
|
-
<h1>Clickable</h1>
|
21
|
-
<p>
|
22
|
-
You can even click on the navigation and jump directly to another section.
|
23
|
-
</p>
|
24
|
-
</div>
|
25
|
-
</div>
|
26
|
-
|
27
|
-
<div class="slide" id="slide2">
|
28
|
-
<h1>Slide 2</h1>
|
29
|
-
</div>
|
30
|
-
|
31
|
-
</div>
|
32
15
|
<div class="section" id="section2">
|
33
16
|
<div class="intro">
|
34
|
-
<div class="sec2_txt01 fadeIn" data-wow-duration="1s" data-wow-delay="1s">
|
17
|
+
<div class="sec2_txt01 wow fadeIn" data-wow-duration="1s" data-wow-delay="1s">
|
18
|
+
<img src="img/section02_txt01.png" width="550" height="73">
|
19
|
+
<p>私たちは、女性のキレイを支えるパートナーとして無理なく「あなたに合った方法」で、ボディメイクを一緒に行っていきます。</p>
|
20
|
+
</div>
|
35
21
|
</div>
|
36
22
|
</div>
|
37
23
|
|
38
24
|
```
|
39
25
|
追加したcss
|
40
26
|
```
|
41
|
-
#section0 {
|
42
|
-
width:100%;
|
43
|
-
height:100%;
|
44
|
-
background-image:url(../img/top.gif);
|
45
|
-
background-position: 50% 50%;
|
46
|
-
background-size: cover; /* 背景画像をフルスクリーン表示 */
|
47
|
-
}
|
48
|
-
|
49
|
-
.con_r {
|
50
|
-
margin: 0 0 0 50%;
|
51
|
-
}
|
52
|
-
|
53
|
-
.sec0_txt01 {
|
54
|
-
margin: 0 0 20px 0;
|
55
|
-
}
|
56
|
-
|
57
27
|
#section2 {
|
58
28
|
width:100%;
|
59
29
|
height:100%;
|
@@ -63,8 +33,12 @@
|
|
63
33
|
}
|
64
34
|
|
65
35
|
.sec2_txt01 {
|
36
|
+
width: 40%;
|
66
|
-
margin: 0 0
|
37
|
+
margin: 150px 0 0 0;
|
67
|
-
background: #9C0;
|
68
38
|
}
|
69
39
|
|
40
|
+
.sec2_txt01 p {
|
41
|
+
color: #666;
|
42
|
+
}
|
43
|
+
|
70
44
|
```
|