Question

我目前正在整理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还包含已包装到this.container内容的正确jQuery对象。问题是我无法使用this.scroller，width()或height()函数设置css()的CSS宽度或高度。

我错过了什么？我已经整理了一个jsFiddle来证明这个问题。如果检查元素检查器，则可以看到div.carousel_scroll_inner元素的维度永远不会更新。

Answer 1

问题是，在这里：

this.container.wrapInner(this.scroller);

jQuery将使用副本。所以this.scroller与this.container以下的任何元素不同。尝试：

this.container.addClass(this.settings.wrapperCls);
this.scroller = $('<div />').addClass(this.settings.innerCls);
this.scroller.append(this.container.contents());
this.container.append(this.scroller);

jQuery height（）函数不在元素上工作

1 个答案: