0

私はこの美しいjqueryスクリプトを持っており、sのリストを取得し、それぞれ4つliにグループ化します。ulli

ただし、一部にはli特別なクラスがあります。<li class="prefslidefeatured">

私はこの特別なliをリストの一番上に置いておきたいので、最初のulで最初のliとして使用します。フィーチャーされたタグ付きのliがいくつかある可能性があるので、それらすべてをリストの先頭に置いて、最初のulにします。

このスクリプトは、この新機能に対応するために簡単に変更できますか？これを達成する方法はありますか？

ダーティテストをすばやく行うためにjsfiddleも作成しました:) http://jsfiddle.net/sandrodz/5at2G/

//This is for footer slider, it rewrites 1 ul into several uls that contain 4 li max.
$(document).ready(function(){

    // get the container, useful for later too...
    var container = $(".prefooterslides");

    // get all available UL and LI elements...
    var li_elements = container.find("LI").clone();

    // remove the current content so that we can rebuild it for the slider...
    container.find("UL").remove();

    // build the slider container...
    var slide_container = $("<div />");
    slide_container.addClass("slides_container");

    // tricky part: looping through the LI's and building each of the slides...
    // first create some helpful variables...
    var li_elements_per_slide = 4;
    var li_counter = 0;
    // create the first slide, with a UL to hold the LI's...
    var current_li_div = $("<div />");
    current_li_div.append($("<ul />"));

    // loop through the LI's...
    li_elements.each(function(index, element){

        li_counter++;
        var current_li = $(element).clone();
        current_li_div.find("UL").append(current_li);

        if (li_counter % li_elements_per_slide == 0)
        {
            // we've hit 4 in this list, so add the slide and make
            // a new one, using same code as before...
            container.append(current_li_div);
            current_li_div = $("<div />");
            current_li_div.append($("<ul />"));
        }

    });

    // we might have an uneven number of LI's, so we need to check for this...
    if (li_counter % li_elements_per_slide != 0)
        container.append(current_li_div);

    // all that's left to do is to initialise the slider script...
    $("#prefooterindex").slides({
        container: 'prefooterslides',
        generatePagination: false
    });

});
4

1 に答える 1

0

これを試して：

変化する：

var li_elements = container.find("LI").clone();

に：

var li_elements = container.find("LI.prefslidefeatured").clone();
li_elements = li_elements.add(container.find('LI:not(.prefslidefeatured)').clone());

最初にすべての機能を取得しli、次にすべての非機能liをアレイの最後に追加します。さらに下に行くと、最初に注目のアイテムが繰り返されます。.each()つまり、一番上のアイテムに追加されulます。

フィドル： http： //jsfiddle.net/5at2G/1/

于 2012-07-23T20:13:31.647 に答える