下記、スクリプトを書きましたが、
Prev / Nextは表示されるのですが、枚数の取得→ (1 of 4) このような表記が表示されません。
なぜでしょうか?
.html('('+ (nextIndex+1) +' of '+ (this.data.length) + ')');
この部分がその表記部分だと思うのですが、、、
なにぶん、素人なもので理解が出来ず。
どなたかご教授頂けたらと思います。何卒宜しくお願い致します!!!!!
jQuery(document).ready(function($) {
// We only want these styles applied when javascript is enabled
$('div.content').css('display', 'block');
$(".each-gallery").each(function(i){
// Initially set opacity on thumbs and add
// additional styling for hover effect on thumbs
var onMouseOutOpacity = 0.67;
// Initialize Advanced Galleriffic Gallery
var gallery = $('#thumbs' + i).galleriffic({
delay: 600,
numThumbs: 10,
preloadAhead: 10,
enableTopPager: false,
enableBottomPager: false,
imageContainerSel: '#slideshow'+ i,
controlsContainerSel: '#controls'+ i,
captionContainerSel: '#caption'+ i,
loadingContainerSel: '#loading'+ i,
renderSSControls: false,
renderNavControls: true,
prevLinkText: 'Prev',
nextLinkText: 'Next',
nextPageLinkText: 'Next ›',
prevPageLinkText: '‹ Prev',
autoStart: false,
syncTransitions: false,
defaultTransitionDuration: 600,
onSlideChange: function(prevIndex, nextIndex) {
// 'this' refers to the gallery, which is an extension of $('#thumbs')
this.find('ul.thumbs')
.hide();
this.find('ul.thumbs').children()
.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
.eq(nextIndex).fadeTo('fast', 1.0);
// Update the photo index display
this.$captionContainer.find('div.photo-index')
.html('('+ (nextIndex+1) +' of '+ (this.data.length) + ')');
},
onPageTransitionOut: function(callback) {
this.fadeTo('fast', 0.0, callback);
},
onPageTransitionIn: function() {
var prevPageLink = this.find('a.prev').css('visibility', 'hidden');
var nextPageLink = this.find('a.next').css('visibility', 'hidden');
// Show appropriate next / prev page links
if (this.displayedPage > 0)
prevPageLink.css('visibility', 'visible');
var lastPage = this.getNumPages() - 1;
if (this.displayedPage < lastPage)
nextPageLink.css('visibility', 'visible');
this.fadeTo('fast', 1.0);
}
});
gallery.find('a.prev').click(function(e) {
gallery.previousPage();
e.preventDefault();
});
gallery.find('a.next').click(function(e) {
gallery.nextPage();
e.preventDefault();
});
function pageload(hash) {
// alert("pageload: " + hash);
// hash doesn't contain the first # character.
if(hash) {
$.galleriffic.gotoImage(hash);
} else {
gallery.gotoIndex(0);
}
}
});
// Initialize history plugin.
// The callback is called at once by present location.hash.
/****************************************************************************************/
});
$('.linkToPrevWorks').children().click(function(){
$(this).parent().next().children('.toggleWrapper').fadeIn(900);
$(this).parent().css("display","none");
});
jQuery(document).ready(function($) {
$('.imgWrapper').children().next('img').css("margin-top", "20px")
});
No.1ベストアンサー
- 回答日時:
よくわからないけれど、これかな?
http://www.twospy.com/galleriffic/example-5.html
斜め読みだけれど、HTML内に
<div class="photo-index"></div>
ってちゃんとありますか?
1)まずデモと同じものを用意して動作することを確認。
2)自分の思っているものに、一部セッティングを修正して、再度確認。
3)動かない場合は直前の修正がおかしい。
一度に全部変えないで、こまめに2)と3)を繰り返すようにすれば、どこが悪いのかわかるのでは?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- PHP style.cssのjQuery条件付きcssが機能しない 4 2022/07/17 18:27
- JavaScript jQueryでのレスポンシブが綺麗に動かない 3 2022/06/21 11:08
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript スマフォではボタンを表示させたくない 2 2023/01/20 14:26
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- その他(SNS・コミュニケーションサービス) 自分のpcがハッキングされたようなメールが来たのですがどうすればいいですか? 4 2022/10/02 16:14
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
関数でy=g(x)のgとは何の略です...
-
AJAX(?)TimeOutエラーが停止...
-
functionから別のfunctionを実...
-
jQueryの"return false"の役割...
-
クリックすると上に開くアコー...
-
javascriptのカプセル化について
-
idを使わずにonclickで自身の要...
-
JavaScriptでの動的な多次元配...
-
google apps scriptの終了のさせ方
-
ASP.NETのコントロールの値をJa...
-
【正規表現】【javascript】CR...
-
二次元配列を使って順位をだす...
-
C#OpenCv V4にのエラーに関する...
-
Click回数を数え、規定された回...
-
FireFoxのjavascriptで自動でキ...
-
Imageコントロール vba
-
重複のない乱数の表示をするには?
-
Linux バイナリ実行できない "...
-
GASでundefinedエラーが出ます
-
「nullまたはオブジェクトでは...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
functionから別のfunctionを実...
-
idを使わずにonclickで自身の要...
-
関数でy=g(x)のgとは何の略です...
-
phpでの文字の点滅表示
-
JAVAスクリプトで指定時間以降...
-
jslintのエラーについて質問
-
ページ内に複数表がある場合のT...
-
XMLHttpRequestでキャッシュを...
-
関数名をテキストから読み込む...
-
jQueryでzipを解凍読み込みする...
-
getElementByIdを使用したグロ...
-
jQuery 同じ処理を関数にまとめ...
-
クリックすると上に開くアコー...
-
小数点以下を5刻みで表示
-
Javascriptで引数の参照渡しか...
-
jQueryの"return false"の役割...
-
javascript(jQuery)でセル内...
-
jQueryの :not() .not() が有効...
-
jqueryの変数を関数の外に出す方法
-
jquery 複数のメソッド
おすすめ情報