asked on

XML MENU - TURN ON CURRECT SECTION BUTTON

On this XML menu, when you mouseover the nav items the fill layer opacity goes to 100%. If I pass in a variable called str_section to the SWF using the flashvar param and embed tags, how do I turn the fill layer on. Having trouble figuring out how to write:

If the items[j].attributes.id; is equal to the passed in str_section variable then turn the fill layer opacity on to 100%, while remaining clickable.

// set stage attributes
Stage.scaleMode = "noScale";
Stage.align = "TL";
// load XML file and ignore white space
menu = new XML();
menu.ignoreWhite = true;
menu.load("left_nav.xml");
// check that XML is loaded
menu.onLoad = function(ok) {
if (ok) {
menuGeneration();
} else {
trace("XML FILE MISSING");
}
};
function menuGeneration() {
// return the items that are in our xml file
items = menu.firstChild.childNodes;
trace(items.length);
// Set Some Widths and Heights
var navWidth = 150;
var lineWidth = navWidth-2;
var fillWidth = navWidth-3;
var startLeftNavY = 0, depth = 0;
// new TextFormat(font, size, color, bold, italic, underline, url, target, align, leftMargin, rightMargin, indent, leading)
var style1_fmt = new TextFormat("Verdana", 12, 0x000000, true, false, false, "", "", "center", "", "", "");
for (j=0; j<=items.length-1; j++) {
var sc = this.createEmptyMovieClip("sub"+depth, depth);
depth++;
sc.createTextField("text_txt", 3, 0, 1, lineWidth, 20);
//name, depth, x, y, width, height
sc.text_txt.multiline = false;
sc.text_txt.wordWrap = true;
sc.text_txt.autoSize = "center";
sc.text_txt.selectable = false;
sc.text_txt.embedFonts = false;
sc.text_txt.text = items[j].attributes.id;
sc.text_txt.setTextFormat(style1_fmt);
var hgt1 = sc.text_txt._height+2>20 ? sc.text_txt._height+2 : 20;
sc.lineStyle(1, 0x912211, 100);
sc.lineTo(lineWidth, 0);
sc.lineTo(lineWidth, hgt1);
sc.lineTo(-1, hgt1);
sc.lineTo(-1, 0);
sc._x = 1;
sc._y = startLeftNavY;
startLeftNavY += sc._height+1;
var lc = sc.createEmptyMovieClip("click_btn", 2);
lc._x = lc._y=1;
lc.lineStyle(0, 0, 0);
lc.beginFill(0xEDD593, 100);
lc.lineTo(fillWidth, 0);
lc.lineTo(fillWidth, hgt1-1);
lc.lineTo(-1, hgt1-1);
lc.lineTo(-1, 0);
lc.endFill();
lc._alpha = 0;
lc.link = items[j].attributes.theurl;
lc.onRollOver = function() {
this._alpha = 100;
};
lc.onRollOut = lc.onDragOut=function () {
this._alpha = 0;
};
lc.onPress = lc.onDragOver=function () {
this._alpha = 100;
};
lc.onRelease = function() {
this.getURL(_root.baseURL+this.link);
};
}
}

Any help would ge greatful.

ASKER CERTIFIED SOLUTION

negatyve

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

madasczik

ASKER

Nice, I think Im getting the hang of this, wound up adding another line so the onRollOut wouldn't remove the highlighted item. Is this the proper way or is there a way to disable the onRollOut function from being used when the ID equals the str_section. Thanks for the help.

lc.onRollOver = function() {
this._alpha = 100;
};
lc.onRollOut = lc.onDragOut=function () {
this._alpha = 0;
};
lc.onPress = lc.onDragOver=function () {
this._alpha = 100;
};
lc.onRelease = function() {
this.getURL(_root.baseURL+this.link);
};
if(_root.str_section == items[j].attributes.id){
lc.onPress();
lc.onRollOut = lc.onDragOut=function () {
this._alpha = 100;
};
}
}
}

negatyve

it's a good way, although the best, at this point, would be:

lc.onRelease = function(){
      this.getURL(_root.baseURL+this.link);
};
if (_root.str_section == items[j].attributes.id) {
      lc._alpha = 100;
} else {
      lc.onRollOver = lc.onPress = lc.onDragOver = function() {
            this._alpha = 100;
      };
      lc.onRollOut = lc.onDragOut=function () {
            this._alpha = 0;
      };
}