Hube02
asked on
JQuery, Select an elements parent element
I have the code below which in JQuery starts with a ul that has a specific ID
then gets each child li of that ul. I will be doing more here on the li element... later
then it gets each child up of each specific li element.. again, I will be doing operation on each li
but now I have a specific li element and I need to get the following information
1) The width of its parent li element
2) The height of its parent li element
Where it says alert(this); is where I have each ul element.
then gets each child li of that ul. I will be doing more here on the li element... later
then it gets each child up of each specific li element.. again, I will be doing operation on each li
but now I have a specific li element and I need to get the following information
1) The width of its parent li element
2) The height of its parent li element
Where it says alert(this); is where I have each ul element.
$('ul#RightSliderMenu').each(function(){
$(this).children('li').each(function(){
// perform operation on li element
$(this).children('ul').each(function(){
// perform operation on ul element
alert(this);
});
});
});
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
>>but not about setting css style using it.
To set some properties:
$(this).css( { backgroundColor:"yellow", fontWeight:"bolder" } );
to find out a property:
$(this).css( "background-color");
You don't have to use "this", if you know the element id:
$("#theId").css(....);
However, I believe the css() will report the css as applied via style="...". Forget jQuery for a second and look at the attached code. Try it. Then remove the style attribute, try it again. See the difference. Hope that makes sense.
To set some properties:
$(this).css( { backgroundColor:"yellow", fontWeight:"bolder" } );
to find out a property:
$(this).css( "background-color");
You don't have to use "this", if you know the element id:
$("#theId").css(....);
However, I believe the css() will report the css as applied via style="...". Forget jQuery for a second and look at the attached code. Try it. Then remove the style attribute, try it again. See the difference. Hope that makes sense.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script>
window.onload=init;
function init(){
alert(document.getElementById("theDiv").style.width);
}
</script>
</head>
<body>
<div id="theDiv" style="width:50%;">Hello</div>
</body>
</html>
ASKER
The problem is that past the id of the main list, I have nothing to go with. there will be no classes or id's on these li and ul elements. In the end the process is going to great an animation that will slide navigation menus out of the right side of the screen, but to keep it accessible, I will be using JQuery(JavaScript) to apply all the initial styles as well as to created the click/mouseover animations. This way if someone visits the site with JS turned off, the will still be able to see the navigation, where if I set the styles in a style sheet and had hidden elements, they would never be able to get to these elements because they are controlled with JS.
Another reason is that we (as in the people I work for) have decided to go with JQuery as a standard package. Rather than using several different things on different sites, we are going to use a standard set of tools, JQuery just happens to be one of those tools in the list.
I still appreciate the input.
Another reason is that we (as in the people I work for) have decided to go with JQuery as a standard package. Rather than using several different things on different sites, we are going to use a standard set of tools, JQuery just happens to be one of those tools in the list.
I still appreciate the input.
ASKER
this is what I have to obtain the information I wanted...
Open in new window