0

質問の言い方がわからなかったので、それも答えが見つからなかった理由だと思います..

jQueryで作成した要素を追加しています。これらの要素にスタイルを追加したいのですが、要素がまだ存在しないのでうまくいきません。これらのスタイルを追加するにはどうすればよいでしょうか? documentFragments について何か読んだことがありますが、それらがどのように機能するのかわかりません..

(jqueryプラグインでの私の最初の試み:)

(function($) {
    $.fn.flPushbox = function(options) {
    settings = $.extend({
        pager: 'true'
    }, options);

    return this.each(function() {
        // set local variables  
        var $pushbox = $(this),
        $slides = $(this).children(),
        $viewport = $('<div class="fl-viewport" />'),
        init,
        initPager;

        //wrap ul with viewport
        init = function (){
            $pushbox.wrap($viewport);

            if (settings.pager) initPager();
        }

        initPager = function() {
            var $pager = $('<ul class="fl-pager" />');

            for (i=0; i<$slides.length; i++) {
                var $pagerSlide = $('<li>'+ i +'</li>');
                $pagerSlide.appendTo($pager);
            }

            $pager.insertAfter($pushbox);
        }

        initStyling = function() {
            var pushboxWidth = 0;

            $slides.each(function(index, slide) {                   
                pushboxWidth += parseInt($(slide).outerWidth());
            });

            $viewport.css({
                'position'  : 'relative',
                'overflow'  : 'hidden'
            });

            $slides.css({
                'float' : 'left'

            });

            $pushbox.css({
                'position'  : 'absolute',
                'top'       : 0,
                'left'      : 0,
                'width'     : pushboxWidth
            });
        }

        init();
        initStyling();
    });
}
})(jQuery);
4

0 に答える 0