jCarouselで好きな位置にボタンを置けるようにする。

| | コメント(0) | トラックバック(0)
たぶん間違いないと思うんだけど、jCarouselってスクロールのためのボタンは自動生成のみで、任意のところには置けない仕様になってる。

CSSである程度はカスタマイズできるものの、タグ構成としては位置が決まってしまっているのでどうにもならないケースもでてくると思われる。というか、でてきた。

こうなったら、jCarousel自体をいじるしかない。


 まあ、けっこう簡単でjcarousel-nextとかで検索すると、143行あたりに
//        this.buttonNext = $('.jcarousel-next', this.container);
        this.buttonNext = $('#jcarousel-next1');
という按配にクラス指定でボタンオブジェクトをとろうとしているところがあるから、こいつをこんな感じでIDに変えちゃう。クラスでもいいと思うんだけど、それは状況に合わせて適当に。nextとprevで2箇所。
で、好きなところに上記IDを付与したタグを書けばよいと。スタイルに関しては元のやつをそのままいじればいいのです。

あ、あとこのままだと、ボタンが勝手に作られちゃうので起動スクリプトのところに
jQuery(document).ready(function() {
    jQuery('#hoge').jcarousel({
        vertical: true,
        scroll: 1,
        wrap: 'both',
        buttonNextHTML: '',
        buttonPrevHTML: ''
    });
});
のように、button*HTML:""を入れてボタンが生成されないようにする。

上の例みたいにID決めうちできなくて、動的にIDが変わる場合とかは、引数にとればいいだけと思われる。



トラックバック(0)

このブログ記事を参照しているブログ一覧: jCarouselで好きな位置にボタンを置けるようにする。

このブログ記事に対するトラックバックURL: http://hirop0164.s326.xrea.com/mt/mt-tb.cgi/244

コメントする


画像の中に見える文字を入力してください。

このブログ記事について

このページは、ぴろしが2009年1月24日 00:22に書いたブログ記事です。

ひとつ前のブログ記事は「jCarouselLiteが使えなかったのでjCarouselでカルーセルを組み込む。」です。

次のブログ記事は「Google Analyticsで"/" と "/index.html"を同じページとしてカウントさせる」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。