Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Применение библиотек > jcarousel

Автор: klem4 12.8.2011, 09:38

Доброго времени суток. Разбираюсь в jcarousel, обновить элемент получается, а добавить новый нет. Начальный контент

Код


<ul id="mycarousel" class="jcarousel-skin-tango">
                            <li><span>bla1</span></li>
                            <li><span>bla2</span></li>
                            <li><span>bla3</span></li>
                            <li><span>bla4</span></li>
                            <li><span>bla5</span></li>
                            <li><span>bla6</span></li>
                            <li><span>bla7</span></li>
                            <li><span>bla8</span></li>
                            <li><span>bla9</span></li>
                          </ul><br>

инициализация карусели, изменение 9-го элемента и добавление 10-го

Код


jQuery(document).ready(function()
    {
        jQuery('#mycarousel').jcarousel( { scroll: 3, visible: 6 } );
        $('#mycarousel').jcarousel('add', 9, '<li><b>test</b></li>'); // значение элемента меняется !
        $('#mycarousel').jcarousel('add', 10, '<li><b>NEW test</b></li>'); // в DOM новый li добавляется, но в карусели его не видно
    }

Заранее спасибо за помощь.

Автор: klem4 12.8.2011, 12:25

Буду рад, если кто-то предложит стандартное решение. Пока реализовал через свою функцию my_add

Код

<script type="text/javascript">
    var cr = null;

    jQuery(document).ready(function()
    {
        $('#mycarousel').jcarousel({
            initCallback: function( carousel )
            {
                cr = carousel;
            }
        });

        cr.my_add = function( html )
        {
            var old_items = $('#mycarousel li');

            this.reset();
            this.size( old_items.size() + 1);

            var this_cr = this;
            var max_index = -1;

            old_items.each( function( index ){
                this_cr.add( index, this );
                ++max_index;
            });

            this_cr.add( ++max_index, html );
        }

        // добавление нового элемента в карусель
        cr.my_add("<li>new item</li>");
    });

</script>