how to get the actual box bigger than the others?

i'm new to javascript and i'm having a problem. I want the actual (function updateBoxes) box [boxIx] to be bigger than the other ones but i can't seem to find a code that works. i've tried box[boxIx].size ="100px"; box[boxIx].style.size ="100px"; without result. This is my code;

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

---

As thirtydot pointed out, you have two instances of "**" in your sample code that I've removed in the assumption that this is a markdown glitch when editing.

Your example shows only the JavaScript code. The HTML markup and CSS styling you're using would be most helpful. I've created a fiddle for discussion and to resolve this for you here: http://jsfiddle.net/bhofmann/zkZMD/

A few things I noticed that might be helpful:

1. You're using a magic number 8 in a few places. Can we assume this is the number of boxes? I would store that in a variable for use in the functions.
2. You used a lot of direct styling. Your code might be cleaner if you used CSS classes to alter the appearance of the boxes.
3. Unless you're altering the default styling of DIV, you won't see much change by simply setting the left offset.

PS. I took the liberty of invoking the init function on page load because I saw nothing else to invoke it. I don't know what would invoke browseLeft and browseRight but I'll leave that to you.