我目前正在组装一个 jQuery 触摸轮播。但是,在设置元素的高度(或宽度)时,我似乎遇到了一个小问题。
以下是该函数的相关代码:
carousel = function( container, options )
{
this.settings = $.extend({
// General settings:
width: 600,
height: 400,
slides: 'div',
snapTo: true,
mouseSupport: true,
trackMovement: true,
slideWidth: 600,
slideHeight: 400,
// CSS classes:
wrapperCls: 'carousel_wrapper',
innerCls: 'carousel_scroll_inner'
}, options);
this.container = container;
this.scroller = null;
this.slides = this.container.children(this.settings.slides);
this.numSlides = this.slides.length;
this.scrollWidth = this.settings.width * this.numSlides;
this.container.addClass(this.settings.wrapperCls);
this.scroller = $('<div />').addClass(this.settings.innerCls);
this.container.wrapInner(this.scroller);
this.scroller.width(1500)
this.scroller.css('width', this.scrollWidth);
this.container.css({ width: this.settings.width, height: this.settings.height });
};
这又是通过执行以下操作来调用的:
$(function() {
var carousel1 = new carousel($('#myElement'));
});
#myElement
肯定存在,不会报错。this.scroller
还包含正确的 jQuery 对象,该对象已包装到this.container
. 问题是我无法this.scroller
使用或函数设置 CSSwidth()
的宽度或高度。height()
css()
我错过了什么?我整理了一个jsFiddle来演示这个问题。如果您检查元素检查器,您可以看到元素的尺寸永远不会更新div.carousel_scroll_inner
。