Forum Moderators: open
var ManMenu =
{
//This fuction sets up the list. it take the parent ul id as a variable finds all li in the ul and adds listener events to them. It also defines divGroup by finding one of the div the list links to then finding the parent of that div.
init: function(thisOverUl, thisDivList)
{
ManMenu.overUl=thisOverUl;
ManMenu.divList=thisDivList;
ManMenu.hideAll();
$("#" + ManMenu.overUl + " li a").bind("mouseover",ManMenu.showMenuListener);
},
hideAll: function()
{
$("#" + ManMenu.divList + " div").addClass('menuHide');
},
//this function starts by hiding all the menues
showMenu: function(element)
{
ManMenu.hideAll();
var elementLink = element.href;
var matchingDiv = elementLink.substring(elementLink.indexOf('#'));
$(matchingDiv).removeClass('menuHide');
$(matchingDiv).addClass('menuShow');
},
showMenuListener: function(event)
{
ManMenu.showMenu(this);
}
};
$(document).ready(function() {
var Women = ManMenu.init("womanhumanbody","womanlist");
var Man = ManMenu.init("humanbody","manlist");
});
var ManMenu =
{
overUl: "humanbody",
divList: "manlist",
//This fuction sets up the list. It finds all li in the ul and adds listener events to them. It also hides all of them although they should already be hidden.
init: function()
{
ManMenu.hideAll();
$("#" + ManMenu.overUl + " li a").bind("mouseover",ManMenu.showMenuListener);
},
//hides all div under the div list by adding a hidding class
hideAll: function()
{
$("#" + ManMenu.divList + " div").addClass('menuHide');
},
//this function starts by hiding all the menues , then it gets the link from each element(LI) and breaks off the div id from them. it removes any hidemenu classes and adds the show menu class.
showMenu: function(element)
{
ManMenu.hideAll();
var elementLink = element.href;
var matchingDiv = elementLink.substring(elementLink.indexOf('#'));
$(matchingDiv).removeClass('menuHide');
$(matchingDiv).addClass('menuShow');
},
showMenuListener: function(event)
{
ManMenu.showMenu(this);
}
};
var WomenMenu =
{
overUl: "womanhumanbody",
divList: "womanlist",
init: function()
{
WomenMenu.hideAll();
$("#" + WomenMenu.overUl + " li a").bind("mouseover",WomenMenu.showMenuListener);
},
hideAll: function()
{
$("#" + WomenMenu.divList + " div").addClass('menuHide');
},
showMenu: function(element)
{
WomenMenu.hideAll();
var elementLink = element.href;
var matchingDiv = elementLink.substring(elementLink.indexOf('#'));
$(matchingDiv).removeClass('menuHide');
$(matchingDiv).addClass('menuShow');
},
showMenuListener: function(event)
{
WomenMenu.showMenu(this);
}
};
$(document).ready(function() {
WomenMenu.init();
ManMenu.init();
});
function ManMenu(thisOverUl, thisDivList) {
this.overUl = thisOverUl;
this.divList = thisDivList;
this.hideAll();
$("#" + this.overUl + " li a").bind("mouseover", this, this.showMenuListener);
}
ManMenu.prototype = {
hideAll: function () {
$("#" + this.divList + " div").addClass('menuHide');
},
showMenu: function (element) {
this.hideAll();
var elementLink = element.href;
var matchingDiv = elementLink.substring(elementLink.indexOf('#'));
$(matchingDiv).removeClass('menuHide');
$(matchingDiv).addClass('menuShow');
},
showMenuListener: function (event) {
event.data.showMenu(this);
}
};
$(document).ready(function () {
var Women = new ManMenu("womanhumanbody", "womanlist");
var Man = new ManMenu("humanbody", "manlist");
});