Just right click and hit View Source. Cut and paste...all done!
Printable View
Just right click and hit View Source. Cut and paste...all done!
i'm not that stupid that i didn't know that. i always like to know what i'm doing , that's why i requested the comments.
That's not what I meant.
What I meant was, most code is easy to take, modify to say what you want, and deploy.
If you want to know HOW it works, download the source, and analyze it. Everything you don't know, look up.
No offense was intended.
Cool method, but those colors! :( Dark blue on black with a thin font makes for very hard to read words...
Just an opinion from a guy who values his eyesight :)
Another note:
That listview method does not work with Netscape. (At least not the latest version of Netscape, v4.76)
Here it goes...
well, hope that helps!!Code:<script LANGUAGE="JavaScript">
var img1 = new Image(); img1.src = "images/plus.gif";
var img2 = new Image(); img2.src = "images/minus.gif";
function doOutline() {
var srcId, srcElement, targetElement;
srcElement = window.event.srcElement; //the menu element that was pressed
if (srcElement.className.toUpperCase() == "LEVEL1" || srcElement.className.toUpperCase() == "FAQ") {
srcID = srcElement.id.substr(0, srcElement.id.length-1); //the last number
targetElement = document.all(srcID + "s"); //ID="OUT0s" for <div style="blah">
srcElement = document.all(srcID + "i"); //ID="OUT0i" for images
if (targetElement.style.display == "none") {
targetElement.style.display = "";
if (srcElement.className == "LEVEL1") srcElement.src = img2.src;
} else {
targetElement.style.display = "none";
if (srcElement.className == "LEVEL1") srcElement.src = img1.src;
}
}
}
document.onclick = doOutline; //do outline when it gets clicked
</script>
know that it uses css styles to 'hide'/'show' the menus...
Very few things work on Netscrap.
If u want this to work in netscape... you'll have to use a different approach... since nestcape doesnt fully support dhtml and css... u'll have to use strictly code!!!
example:
[pre]
function doOutline(link, text) {
//--------------------------------------------------
// The event that called this function will need to
// pass a link and text that goes in the link.
// You need to do one for each ...
//--------------------------------------------------
var args = doOutline.arguments; //# of arguments passed to this function
var img1 = new Image(); img1.src = "images/plus.gif";
var img2 = new Image(); img2.src = "images/minus.gif";
//ok never mind....
}
[/pre]
forget about that... use this instead... it works:
http://www.webmonkey.com/
has the same thing except its really flexible and it works on all browsers.
here's what ur looking for:
[pre]
<script language="Javascript">
<!-- Hide script from old browsers
document.WM = new Object(); //declare the object
document.WM.menu = new Object(); //declare a menu (within the object)
document.WM.menu.dropdown = new Array(); // dropdown for the menu
function WM_initializeToolbar(){
var i;
if (document.all){ //if its netscape
for(i = 0; i < document.all('container').all.length; i++){
if ((document.all('container').all[i].className == 'header') ||
(document.all('container').all[i].className == 'links')){
document.WM.menu.dropdown[document.WM.menu.dropdown.length]
= document.all('container').all[i];
}
}
} else if (document.getElementsByTagName && document.getElementById){ //if its ie
var contained =
document.getElementById('container').getElementsByTagName('div');
for(i = 0; i < contained.length; i++){
if ((contained[i].getAttribute('class') == 'header') ||
(contained[i].getAttribute('class') == 'links')){
document.WM.menu.dropdown[document.WM.menu.dropdown.length]
= contained[i];
}
}
}
}
function WM_collapse(item){ //function to collapse menu
if(document.WM.menu.dropdown.length){
if (document.WM.menu.dropdown[item + 1].style.display == 'none'){
document.WM.menu.dropdown[item + 1].style.display = '';
if(document.WM.menu.dropdown[item].id == 'webmonkey'){
document.images[document.WM.menu.dropdown[item].id +
'Img'].src = '/webmonkey/images/open_gray.gif';
} else {
document.images[document.WM.menu.dropdown[item].id +
'Img'].src = '/webmonkey/images/open.gif';
}
} else {
document.WM.menu.dropdown[item + 1].style.display = 'none';
if(document.WM.menu.dropdown[item].id == 'webmonkey'){
document.images[document.WM.menu.dropdown[item].id +
'Img'].src = '/webmonkey/images/closed_gray.gif';
} else {
document.images[document.WM.menu.dropdown[item].id +
'Img'].src = '/webmonkey/images/closed.gif';
}
}
}
}
function WM_imageSwap(daImage, daSrc){
var objStr,obj;
/*
WM_imageSwap()
Changes the source of an image.
Source: Webmonkey Code Library
(http://www.hotwired.com/webmonkey/javascript/code_library/)
Author: Shvatz
Author Email: [email protected]
*/
// Check to make sure that images are supported in the DOM.
if(document.images){
// Check to see whether you are using a name, number, or object
if (typeof(daImage) == 'string') {
// This whole objStr nonesense is here solely to gain compatability
// with ie3 for the mac.
objStr = 'document.' + daImage;
obj = eval(objStr);
obj.src = daSrc;
} else if ((typeof(daImage) == 'object') && daImage && daImage.src) {
daImage.src = daSrc;
}
}
}
// End the hiding -->
</script>
[/pre]
good luck... and if u need help... they have lots of tuts at their site.
peace!
DHTML
go to your browser and search for it and find a turorial on
building dynamic menu's
BTY: Dennis...cool stuff...