我不确定如何说出这个问题,所以我猜这也是我找不到答案的原因..
我正在追加我在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);