teratail
回答率
85.48%
質問するログイン新規登録
トップに関する質問Flippageスライダーを自動再生させたいです。

編集履歴

質問編集履歴

9

追記

2018/03/30 04:05

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -26,6 +26,10 @@
26
26
 
27
27
  エラーは出てませんが、目的の動作もしない状況です。
28
28
 
29
+ btnclickにあるalert('Hello');は動作するが
30
+
31
+ ボタンをクリックさせてスライドをさせる動きができません。
32
+
29
33
  ```
30
34
 
31
35
 

8

誤字

2018/03/30 04:05

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -24,7 +24,7 @@
24
24
 
25
25
  ```
26
26
 
27
- どうすればいいのか行き詰ってます。
27
+ エラーは出てませんが、目的の動作もしない状況です。
28
28
 
29
29
  ```
30
30
 

7

ソース修正

2018/03/30 04:02

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -100,9 +100,7 @@
100
100
 
101
101
  width: 500,
102
102
 
103
- height: 333,
103
+ height: 333
104
-
105
- auto:true
106
104
 
107
105
  });
108
106
 
@@ -176,7 +174,7 @@
176
174
 
177
175
  <div><!-- <a href="#" onclick="$('.exemples:eq(0)').trigger('previous'); return false;">Previous</a> --> -
178
176
 
179
- <a href="#" id="test" onclick="startInterval();javascript:$('.exemples:eq(0)').trigger('next'); ">Next</a></div>
177
+ <a href="#" id="test" onclick="javascript:$('.exemples:eq(0)').trigger('next'); startInterval();">Next</a></div>
180
178
 
181
179
  </div>
182
180
 

6

ソース修正

2018/03/30 02:43

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -100,7 +100,9 @@
100
100
 
101
101
  width: 500,
102
102
 
103
- height: 333
103
+ height: 333,
104
+
105
+ auto:true
104
106
 
105
107
  });
106
108
 
@@ -128,7 +130,7 @@
128
130
 
129
131
  function startInterval(){
130
132
 
131
- var intervalId = setInterval('onclick()', 5000);
133
+ var intervalId = setInterval('btnclick()', 5000);
132
134
 
133
135
  }
134
136
 
@@ -172,7 +174,7 @@
172
174
 
173
175
  </div>
174
176
 
175
- <div><!-- <a href="#" onclick="$('.exemples:eq(0)').trigger('previous'); return false;">Previous</a> -->
177
+ <div><!-- <a href="#" onclick="$('.exemples:eq(0)').trigger('previous'); return false;">Previous</a> --> -
176
178
 
177
179
  <a href="#" id="test" onclick="startInterval();javascript:$('.exemples:eq(0)').trigger('next'); ">Next</a></div>
178
180
 

5

誤植を訂正

2018/03/30 02:42

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -100,9 +100,7 @@
100
100
 
101
101
  width: 500,
102
102
 
103
- height: 333,
103
+ height: 333
104
-
105
- auto:true
106
104
 
107
105
  });
108
106
 

4

文字の訂正

2018/03/30 02:39

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
 
6
6
 
7
- 目的は以下のJqueryを自動再生する事です。
7
+ 目的は以下のスライダーを自動再生する事です。
8
8
 
9
9
  https://marcbuils.github.io/Flippage/
10
10
 

3

ソースの内容を一部だったので全体を記載しました。

2018/03/30 02:19

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -130,7 +130,7 @@
130
130
 
131
131
  function startInterval(){
132
132
 
133
- var intervalId = setInterval('onclick('')', 5000);
133
+ var intervalId = setInterval('onclick()', 5000);
134
134
 
135
135
  }
136
136
 

2

ソースの内容を一部だったので全体を記載しました。

2018/03/30 02:15

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -174,7 +174,9 @@
174
174
 
175
175
  </div>
176
176
 
177
- <div><!-- <a href="#" onclick="$('.exemples:eq(0)').trigger('previous'); return false;">Previous</a> --> - <a href="#" id="test" onclick="startInterval();javascript:$('.exemples:eq(0)').trigger('next'); ">Next</a></div>
177
+ <div><!-- <a href="#" onclick="$('.exemples:eq(0)').trigger('previous'); return false;">Previous</a> -->
178
+
179
+ <a href="#" id="test" onclick="startInterval();javascript:$('.exemples:eq(0)').trigger('next'); ">Next</a></div>
178
180
 
179
181
  </div>
180
182
 

1

ソースの内容を一部だったので全体を記載しました。

2018/03/30 02:12

投稿

shun_jp
shun_jp

スコア7

test CHANGED
File without changes
test CHANGED
@@ -36,21 +36,177 @@
36
36
 
37
37
  ```
38
38
 
39
- function btnclick(){
40
-
41
- 　　document.getElementById('test').click;
42
-
43
- }
44
-
45
- function startInterval(){
46
-
47
- 　　var intervalId = setInterval('onclick('')', 5000);
48
-
49
- }
50
-
51
- ```
52
-
53
- <a href="#" id="test" onclick="startInterval();javascript:$('.exemples:eq(0)').trigger('next'); ">Next</a></div>
39
+ <!DOCTYPE html>
40
+
41
+ <html>
42
+
43
+ <head>
44
+
45
+ <meta charset=utf-8>
46
+
47
+ <meta name="apple-mobile-web-app-capable" content="yes">
48
+
49
+ <meta name="apple-touch-fullscreen" content="yes">
50
+
51
+ <title>FlipPage</title>
52
+
53
+
54
+
55
+ <!-- jQuery -->
56
+
57
+ <script src="../jquery.min.js"></script>
58
+
59
+
60
+
61
+ <!-- Flippage -->
62
+
63
+ <script src="../jquery.flippage.min.js"></script>
64
+
65
+ <link href="../jquery.flippage.css" type="text/css" rel="stylesheet" />
66
+
67
+
68
+
69
+ <style>
70
+
71
+ body > div {
72
+
73
+ display: block;
74
+
75
+ margin-left: 50px;
76
+
77
+ margin-top: 50px;
78
+
79
+ }
80
+
81
+
82
+
83
+
84
+
85
+ .exemples > div {
86
+
87
+ background-color: white;
88
+
89
+ }
90
+
91
+ </style>
92
+
93
+ <script>
94
+
95
+ (function($){
96
+
97
+ $(document).ready(function(){
98
+
99
+ $('.exemples:eq(0)').flippage({
100
+
101
+ width: 500,
102
+
103
+ height: 333,
104
+
105
+ auto:true
106
+
107
+ });
108
+
109
+
110
+
111
+ $('.exemples:eq(1)').flippage({
112
+
113
+ width: 300,
114
+
115
+ height: 150
116
+
117
+ });
118
+
119
+ });
120
+
121
+ })(jQuery);
122
+
123
+ function btnclick(){
124
+
125
+ document.getElementById('test').click;
126
+
127
+ // alert('Hello');
128
+
129
+ }
130
+
131
+ function startInterval(){
132
+
133
+ var intervalId = setInterval('onclick('')', 5000);
134
+
135
+ }
136
+
137
+ </script>
138
+
139
+ </head>
140
+
141
+ <body>
142
+
143
+ <h1>Page d'exemples d'utilisation du plugin FlipPage</h1>
144
+
145
+ <div>
146
+
147
+ <h2>Exemple 1</h2>
148
+
149
+ <div class="exemples">
150
+
151
+ <div><img src="img/img1.jpg" style="margin-left: 0px;" /></div>
152
+
153
+ <div><img src="img/img1.jpg" style="margin-left: -250px;" /></div>
154
+
155
+ <div><img src="img/img2.jpg" style="margin-left: 0px;" /></div>
156
+
157
+ <div><img src="img/img2.jpg" style="margin-left: -250px;" /></div>
158
+
159
+ <div><img src="img/img3.jpg" style="margin-left: 0px;" /></div>
160
+
161
+ <div><img src="img/img3.jpg" style="margin-left: -250px;" /></div>
162
+
163
+ <div><img src="img/img4.jpg" style="margin-left: 0px;" /></div>
164
+
165
+ <div><img src="img/img4.jpg" style="margin-left: -250px;" /></div>
166
+
167
+ <div><img src="img/img5.jpg" style="margin-left: 0px;" /></div>
168
+
169
+ <div><img src="img/img5.jpg" style="margin-left: -250px;" /></div>
170
+
171
+ <div><img src="img/img6.jpg" style="margin-left: 0px;" /></div>
172
+
173
+ <div><img src="img/img6.jpg" style="margin-left: -250px;" /></div>
174
+
175
+ </div>
176
+
177
+ <div><!-- <a href="#" onclick="$('.exemples:eq(0)').trigger('previous'); return false;">Previous</a> --> - <a href="#" id="test" onclick="startInterval();javascript:$('.exemples:eq(0)').trigger('next'); ">Next</a></div>
178
+
179
+ </div>
180
+
181
+ <div>
182
+
183
+ <h2>Exemple 2</h2>
184
+
185
+ <div class="exemples">
186
+
187
+ <div><h3>Page 1</h3></div>
188
+
189
+ <div><h3>Page 2</h3> <a href="#" onclick="alert('Pages are clickable !'); return false;">Test me</a></div>
190
+
191
+ <div><h3>Page 3</h3></div>
192
+
193
+ <div><h3>Page 4</h3></div>
194
+
195
+ <div><h3>Page 5</h3></div>
196
+
197
+ <div><h3>Page 6</h3></div>
198
+
199
+ <div><h3>Page 7</h3></div>
200
+
201
+ <div><h3>Page 8</h3></div>
202
+
203
+ </div>
204
+
205
+ </div>
206
+
207
+ </body>
208
+
209
+ </html>
54
210
 
55
211
  ```
56
212