0

我想制作水平可滚动的容器，它将子元素保留在 y 线上（宽度超过屏幕的 100%）。

如果数据是固定的，我会在渲染之前计算它并设置容器的宽度。问题是我的数据是动态的，我不知道要添加的子元素的数量及其宽度。所以我决定将它们作为子元素动态添加到容器 DOM 中，但是当我尝试在附加后获取它们的宽度时，结果为 0。我做错了什么，或者如果你有更好的想法，我会很高兴看到你的方式。

这就是我现在正在做的事情：

GalleryContainer.prototype.addItem = function(newItem) {
    var newItemDiv = document.createElement('div');
    newItemDiv.className = 'thumbnail';

    content = document.createElement('img');
    content.setAttribute('src', newItem);

    newItemDiv.appendChild(content);
    this.galleryDiv.appendChild(newItemDiv);
    this.galleryArray.push(newItemDiv);

        // width, offsetWidth, all properties are 0
        console.log(newItemDiv.style.offsetWidth); 
        console.log($(content).css('width'));
        console.log($(newItemDiv).innerWidth());

}

编辑： 我用我的问题做了一个 jsfiddle 示例，在演示中宽度不是 0，它是我需要的实际大小，所以我必须更深入地寻找问题。 http://jsfiddle.net/valkirilov/QaHn7/1/

4

1 回答 1

0

波纹管代码正在工作，也许您的 newItemDiv 没有附加到 HTML 文档中：

var newItemDiv = document.createElement('div');
newItemDiv.className = 'thumbnail';
$('body').append(newItemDiv);


// width, offsetWidth, all properties are 0
console.log(newItemDiv.style.offsetWidth); 
console.log($(content).css('width'));
console.log($(newItemDiv).innerWidth());
于 2013-10-30T20:07:23.843 回答