Question

我是javascript的新手，我遇到了问题。我希望实际（函数updateBoxes）框[boxIx]比其他框大，但我似乎找不到有效的代码。我试过箱子[boxIx] .size =“100px”; box [boxIx] .style.size =“100px”;没有结果。这是我的代码;

function init() {

    box = document.getElementById("boxes").getElementsByTagName("div");
    for (var i=0; i<box.length; i++) {
        box[i].style.left = 70*i+"px";
    } // End for

    boxIx = box.length - 8;
    updateBoxes();
} // End init

function browseLeft() {
    if (boxIx > 0) boxIx = boxIx - 1;
    updateBoxes();
} 
// End browseLeft

function browseRight() {
    if (boxIx < box.length-1) boxIx = boxIx + 1;
    updateBoxes();}
 // End browseRight


**function updateBoxes() {

    box[boxIx].style.backgroundColor ="#CCC";
    box[boxIx].style.top = "20px";
    box[boxIx].style.zIndex = 9;**


    var z = 8;
    for (var i=boxIx-1; i>=0; i--) {
        box[i].style.backgroundColor ="#666";
        box[i].style.top = "0px";
        box[i].style.zIndex = z;
        z = z - 1;
    } // End for

    z = 8;
    for (var i=boxIx+1; i<box.length; i++) {
        box[i].style.backgroundColor = "#666";
        box[i].style.top = "0px";
        box[i].style.zIndex = z;
        z = z - 1;
    } // End for
} // End browseLeft

Answer 1

正如thirtydot指出的那样，你在示例代码中有两个“**”实例，我假设在编辑时这是一个降价故障我已经删除了。

您的示例仅显示JavaScript代码。您正在使用的HTML标记和CSS样式将是最有帮助的。我已经创建了一个讨论小提琴，并在此处为您解决此问题：http://jsfiddle.net/bhofmann/zkZMD/

我注意到的一些事情可能会有所帮助：

您在一些地方使用了 8 的幻数。我们可以假设这是盒子的数量吗？我会将它存储在一个变量中，以便在函数中使用。
你使用了很多直接造型。如果您使用CSS类来改变框的外观，那么您的代码可能会更清晰。
除非您改变DIV的默认样式，否则只需设置左偏移量就不会发现太多变化。

PS。我冒昧地在页面加载时调用init函数，因为我没有看到任何其他东西来调用它。我不知道什么会调用browseLeft和browseRight，但我会把它留给你。

如何让实际的盒子比其他盒子更大？

1 个答案: