質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
スライダー

GUIのグラフィカルウィジェットのひとつです。インジケーターを動かすことで値を調節可能とします。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

3回答

5161閲覧

skipprの自動再生

141kanae

総合スコア28

スライダー

GUIのグラフィカルウィジェットのひとつです。インジケーターを動かすことで値を調節可能とします。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2015/06/12 06:32

skipprというスライドショーを導入しようと思っているのですが、
autoPlayの部分をtrueにしても自動再生がされません。

//Skipperの初期化
$("document").ready(function() {
$("#theTarget").skippr();
});

// オプションを指定してSkipperの実行
$("#theTarget").skippr({
// スライドショーの変化 ("fade" or "slide")
transition : 'fade',
// 変化に係る時間(ミリ秒)
speed : 1000,
// easingの種類
easing : 'easeOutQuart',
// ナビゲーションの形("block" or "bubble")
navType : 'block',
// 子要素の種類("div" or "img")
childrenElementType : 'div',
// ナビゲーション矢印の表示(trueで表示)
arrows : true,
// スライドショーの自動再生(falseで自動再生なし)
autoPlay : true,
// 自動再生時のスライド切替間隔(ミリ秒)
autoPlayDuration : 5000,
// キーボードの矢印キーによるスライド送りの設定(trueで有効)
keyboardOnAlways : true,
// 一枚目のスライド表示時に戻る矢印を表示するかどうか(falseで非表示)
hidePrevious : false
});

他に編集が必要な箇所があるのでしょうか。
お分かりの方がいらっしゃったら、ご教授頂けると助かります。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

先程の回答で出来たと書いた者です。
せっかく出来たのですが、よく見てみると挙動がおかしく、スライドしたままどこか画面のはしっこまで飛んでいってしまって、画像が戻ってきません。(笑)その間、真っ白な画面を見て待っていないといけません。。。
fadeにすると、フェードアウトが1秒ずつの切り替わりが続いて止まらなくなってしまったり、元に戻ったかと思うとブッツリと表示が消えてしまったり、うまく動きません。
firefoxやchromeの最新版ではうまく動かないのかもしれませんね。残念です。。。

投稿2015/10/29 08:00

shinamon4d

総合スコア12

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

私も同じところで長時間つまってました。。。
上記のアンサーを見て色々書きなおした結果何とか動きました。
参考になりました。ありがとうございます!

<script type="text/javascript"> //Skipperの初期化 $("document").ready(function() { $("#theTarget").skippr({ // スライドショーの変化 ("fade" or "slide") transition : 'fade', // 変化に係る時間(ミリ秒) speed : 1000, // easingの種類 easing : 'easeOutQuart', // ナビゲーションの形("block" or "bubble") navType : 'block', // 子要素の種類("div" or "img") childrenElementType : 'div', // ナビゲーション矢印の表示(trueで表示) arrows : true, // スライドショーの自動再生(falseで自動再生なし) autoPlay : true, // 自動再生時のスライド切替間隔(ミリ秒) autoPlayDuration : 5000, // キーボードの矢印キーによるスライド送りの設定(trueで有効) keyboardOnAlways : true, // 一枚目のスライド表示時に戻る矢印を表示するかどうか(falseで非表示) hidePrevious : false }); }); </script>

投稿2015/10/29 07:47

shinamon4d

総合スコア12

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ベストアンサー

skipperの初期化の方があとに実行されてます。
$(document).ready(function(){});の中で実行しましょう。

投稿2015/06/12 07:23

編集2015/06/12 07:24
orange0190

総合スコア1698

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

141kanae

2015/06/16 00:08

回答有難うございます。 中に書かなければいけなかったのですね…! 一応、JSのファイルに同じ記述があったので直接書き換えてみたらそちらでも動きました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問