|
Until you sign up you can't do much. Yes, it's free.
|
|
|
|
|
|
|
|
|
 | / / / Viewing Topic
|  |
|
|
javascript |
| need help with DHTML list script |
|
|
|
|
 Replies: 14 — Last Post Jan. 21 8:22am by Echo one
|
|
|
|
|
( Echo one )
Dairy Product Addict
|
    
hey, let's get this out of the way. I do not in any way consider myself good at javascript. As a web designer it has been my weakness. I don't know why, it just is. I can write php, but javascript gives me a headache. alright, so this is a basic list-based DHTML drop down navigation menu. the old script I had was rather static in it's methods (it used names rather than dealing with the concept itself)
in other words it was built for a specific instance. I'm getting to the point where I'm tired of it, so I'm trying to move to a dynamic script that will build whatever I want it to dynamically. so I'm trying to use nodes. the problem is apparently not in the syntax (I'm not getting those little yellow error messages in the corner) it's somewhere in the script itself that is not applying itself to what I want it to. ie, nothing happens onMouseOver. | Code: | <script type='text/JavaScript'>
function list() {
if (document.getElementsByTagName) {
node="document.getElementsByTagName('LI')";
listNode = "document.getElementsByTagName('UL')";
node.onMouseOver = "node.childNodes.style.display = 'block'";
}
node.onMouseOut = "node.childNodes.style.display = 'none'; if (listNode.class == 'sub') { listNode.style.display = 'none'}";
}
if (node.childNodes.style.display == 'block') {
node.style.display = 'block';
}
}
else {
alert("your browser does not support javascript. Either you have it turned off or do not have it, this page may not load correctly and you may not be able to access certain parts of the site.")
}
}
body.onLoad = list();
</script> |
alright, so can anyone tell me why it's not doing anything on li.onMouseOver?
-------
I decided to be different from the rest of the world and be a
smart ass.
|
|
|
rand0mguy
Professional
|
 
are you using xhtml or html.. and waht DTD
-------
aaaaaah im bored
|
|
|
( Echo one )
Dairy Product Addict
|
xhtml, and it's been awhile, remind me what dtd is.
-------
I decided to be different from the rest of the world and be a
smart ass.
|
|
|
( Echo one )
Dairy Product Addict
|
that doesn't really matter does it?
-------
I decided to be different from the rest of the world and be a
smart ass.
|
|
|
|
|
|
|
|
|
( Echo one )
Dairy Product Addict
|
Quote: from pleaseremove at 6:31 am on Jan. 20, 2008
 Quote: from Echo one at 12:55 am on Jan. 20, 2008
Quote: from pleaseremove at 6:11 am on Jan. 15, 2008
OK, I'm not actually sure what you want your code to do here. Is this just a drop-down menu? Anyway, if it is you should be doing this with CSS, the last thing you want to do is make the core way people navigate with your site based on something that could be turned off. 
it's a mix of css and javascript. I'm aware that that poses problems but I'm not sure there's a way to do this without some javascript involved. At best I could store a lot of the info in the :hover attribute, but at the very least to my knowledge the display attribute has to be changed with javascript since the act of displaying involves the mouseover of a different object. keep in mind that I have a script that works, but it deals only with specific instances ie. this is what happens when this. This one, I'm trying to make it apply to any instance of a drop down or otherwise onMouseOver display menu by saying that anyLi.onMouseOver = display sublist if one exists.
Sounds like you want to look into something like this: http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/default.asp
that would be great, except that site had no information on how to do a pure css dropdown menu. I've heard of them, and attempted them. But it comes down to needing to be able to use ul li:hover and idk if other browsers support it, but my ie for some reason does not.
-------
I decided to be different from the rest of the world and be a
smart ass.
|
|
|
|
|
|
|
|
|
( Echo one )
Dairy Product Addict
|
it works amazingly. I just can't figure out from their source how they did it. I know it's pathetic. Coding has never come all that easily to me.
-------
I decided to be different from the rest of the world and be a
smart ass.
|
|
|
( Echo one )
Dairy Product Addict
|
| Code: | * html ul li { float: left; }
* html ul li a { height: 1%; }
ul {
margin: 0;
padding-right: 15px;
list-style: none;
}
ul li {
position: relative;
font-color: #0000ff;
list-style: none;
background-color:blue;
}
li ul {
display:none;
list-style:none;
position: absolute;
padding: 20px;
top: 45px;
left: 0px;
width: 60px;
font-color: #0000ff;
}
li:hover ul {
display:block;
}
li a:hover ul {
display:block;
}
li ul:hover, li a ul:hover {
display:block;
}
|
that's basically what I have (without putting in all of the rest of the just aesthetic things to change the menu.
-------
I decided to be different from the rest of the world and be a
smart ass.
|
|
|
|
|
|
|
|
| Looking for something else?
|
|
|
|
|
|
| / / / Viewing Topic | |
|
657 users online 
165566 members 
You have 1 new message.
Patron
