jCarousel Liteの要素を jQueryで append

jCarousel Liteでカルーセル(縦横スライド)してるとき、スライドする要素を入れ替えたいなと。
 
[code lang=”html”]

[/code]
 
普通、こんな風に書きます。(idとclassは普通付けませんが説明のため便宜的に付けました)
この<li>要素をこういう風に書かないで、投稿のカテゴリ一覧から取ってきて、動的に突っ込むのはどうだろうということです。(最初の<ul>は空っぽということですね)
 
[code lang=”html”]

jQuery(“#xxx”).append(“

  • “);

    [/code]
     
    こうして appendすると確かに要素としてはアペンドされてるっぽいんですけど、アペンドされた内容がカルーセルしません。
    じゃあ、最初に必要な分だけ並べておいて、srcを書きかえればいいじゃん、ということで、
     
    [code lang=”html”]

    jQuery(“#i1”).attr(“src”, “images/thumb-04″);

    [/code]
     
    こうやってみましたが、うまくいきません。正解はコレ!
     
    [code lang=”html”]

    jQuery(“#c1”).attr(“src”, “images/thumb-04″);

    [/code]
     
    jCarousel Liteのコードを読んでみるとわかるんですが、サーキュラー(くるくる回る)のときは、<li>要素をクローンしているんですね。
     
    [code lang=”script”]
    if(o.circular) {
    ul.prepend(tLi.slice(tl-v-1+1).clone())
    .append(tLi.slice(0,v).clone());
    o.start += v;
    }
    [/code]
     
    だから、idでソースを指定してもクローンされる前のソースが書き変わるわけではないのでダメ、なのかな?
    クラス指定だったら、元のもクローンのも全部書き変えちゃうからOKね。
    appendがダメなのは、クローンされる前に appendできないからだろうか。jCarousel Liteより先に appendしてるつもりなんだけど、難しいね。
     
    参考:jQuery でoption要素を追加した際の諸問題

    0 返信

    返信を残す

    Want to join the discussion?
    Feel free to contribute!

    コメントを残す

    メールアドレスが公開されることはありません。 * が付いている欄は必須項目です