Here's a tricky one

[Scott-Copywriter]

Well, it is to me at least.

I have some JavaScript code which is included into my PHP index file with a <script> command. This takes the <ul> and <li> tags which create lists and then turns them into drop-down menus which I use in my main menu.

However, I'm using a Wordpress blog, and no matter what I do, the widgets in the side bar construct themselves using <ul> and <li> tags, which then turn into drop-down menus due to the JavaScript. This basically messes the whole thing up.

What I need to be able to do is make the JavaScript apply only to <ul> and <li> tags in a particular div, such as the header or menu div, whilst leaving the list tags in the rest of the page alone.

Any tips?

 

[alphanumeric]

would need to see the code but... you should be making sure your js finds the ul by its id rather than just the tag. use something like: document.getElementById

 

[Scott-Copywriter]

would need to see the code but... you should be making sure your js finds the ul by its id rather than just the tag. use something like: document.getElementById

It seems to contain it in some way:

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace(" over", "");
   }
   }
  }
 }
}
window.onload=startList;// JavaScript Document

If this code means that it should only be influencing the list tags in the nav div, then perhaps I've made an error somewhere.

 

[fisicx]

Scott,

You don't need he script. The drop down functionality is built into wordpress.

Just use the menu feature to set up which pages are children. OK so you might need to fiddle with the CSS a bit but that's all.

 

[alphanumeric]

from what i gather that is looking for any elements that have the id nav.

then finding everything that has <li> and applying the hover class on mouse over.

I would try applying the id directly to the containing <ul> rather than the div.


can i ask whats it for? I presume its a ie5 or older fallback?

 

[Scott-Copywriter]

Scott,

You don't need he script. The drop down functionality is built into wordpress.

Just use the menu feature to set up which pages are children. OK so you might need to fiddle with the CSS a bit but that's all.

My actual website is built from scratch, so I've used the JS code for the drop down menu.

The blog is a separate installation where I've adjusted the coding of a basic theme so it looks like the blog is integrated into my site. That's where the issue lies it seems!

from what i gather that is looking for any elements that have the id nav.

then finding everything that has <li> and applying the hover class on mouse over.

I would try applying the id directly to the containing <ul> rather than the div.


can i ask whats it for? I presume its a ie5 or older fallback?

Does that mean it's looking for <li> tags only in divs with the ID 'nav' and nowhere else?

And it's just for the basic drop down of the 'services' menu link which you can see in the site in my signature. I took a free basic JS piece from a friend who used it on his site, so I have no idea how old it is. No doubt I'm using some kind of archaic method or something.

 

[fisicx]

Go get the suckerfish drop down navigation: http://www.htmldog.com/articles/suckerfish/dropdowns/

Will solve everything...

 

[alphanumeric]

Does that mean it's looking for <li> tags only in divs with the ID 'nav' and nowhere else?

yes, although not only in divs basically every element that has the id "nav" (i hope)

I took a free basic JS piece from a friend who used it on his site, so I have no idea how old it is. No doubt I'm using some kind of archaic method or something.

yes its a very old way of doing things, in fact it was outdated when ie6 came out!

all this can be done using pure css so i suggest updating it to a more modern method.

 

[trustmenow]

with jquery you can use something like this

$('#nav').hover(function()
{
$(this).show();
});

if you need help contact me.

 

[Dark-Kni]

i guess the code itself makes error due to the "outdated" issue. try "new" codes available to accomplish your task.


regards!

 

[10032012]

Well, it is to me at least.

I have some JavaScript code which is included into my PHP index file with a <script> command. This takes the <ul> and <li> tags which create lists and then turns them into drop-down menus which I use in my main menu.

However, I'm using a Wordpress blog, and no matter what I do, the widgets in the side bar construct themselves using <ul> and <li> tags, which then turn into drop-down menus due to the JavaScript. This basically messes the whole thing up.

What I need to be able to do is make the JavaScript apply only to <ul> and <li> tags in a particular div, such as the header or menu div, whilst leaving the list tags in the rest of the page alone.

Any tips?

have you tried assigning them an ID... then checking for that?