I have a menu that is made from a ul element (with li children).
Here is an example:
<
ul
id
="menu"
> <
li
><
a
href
="#divEntire2">
Home Page
</
a
></
li
> <
li
><
a
href
="#divAboutUs">
About Us
</
a
></
li
>
<
li
><
a
href
="#divLogin">
Log in
</
a
></
li
> </
ul
>
I use CSS to make the ul elements look like a menu. This behaves OK when you click on the words, but nothing happens when you click on the background under the words. (there is a background image that repeats that creates the illusion of a bar under the menu with a moving element)
I can detect when the user clicks on either the words or the background bar with the following:
/* $(
"ul#menu li"
).click(
function
() { */
But even though its detected, the 'href' property is missing when I click on the background bar (its not missing when I click on the text).
(more specifically, I look for the href property of $(this).children("a") ).
So I want to enumerate the properties in the element passed to this function, and see what is happening.
So I grabbed a code snippet from the internet:
/*function
myEnumerator(source) {
var
property, propCollection =
""
;
for
(property
in
source) {
if
(source.hasOwnProperty(property))
{
propCollection += (property +
": "
+ source[property] +
"\n"
);
}
}
alert(
'propertycollection is '
+ propCollection);
} */
But oddly enough, whether I click on menu text, or on menu background, I get the same results, which are:
O: [objectHTMLIEElement]
In other words, I can't find out what the properties are of $(this).
Any help is appreciated
-- Gid
P.S. The following might help: when I get href below, its 'undefined' when I click on the bar
$(
"ul#menu li"
).click(
function
() {
var
href = $(
this
).children(
"a"
).attr(
"href"
);
However, if I do something like $(this).css('background-color','maroon'), the text and a section of bar under it does turn maroon. This happens even I just click on the bar.