Forums

kelvinseasons

Hello all i've finally started to do some real jquery stuff instead of reading tutorial etc,

so i noticed something.

I write css like this

ul.menu
ul.menu li ul li

In jquery there is this addClass('') thing.
Can i have something like addClass('ul.menu') or it only accepts addClass('menu')

blue642

It would only accept "menu" because menu is the only class you mentioned.

ul.menu means literally a "ul" element (unordered list) with a "menu" class attribute.
aka:

<ul class=\"\"menu></ul>

so "ul.menu" is not a class name.

what exactly are you trying to accomplish, I may be able to help.

kelvinseasons

Thanks i really need some help here.
I've attached the css, jquery code, html code all in 1 file below.

WIthout jquery it works in all browsers which support li:hover but i'm trying to make it work with ie6 also.

<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
<link rel=\"stylesheet\" type=\"text/css\" href=\"css/default.css\" media=\"screen\" />
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>

<style type=\"text/css\">

*{
padding:0;
margin:0;
}

ul.menu, ul.menu li ul{
list-style:none;
}

ul.menu li{
float:left;
width:100px;
height:25px;
display:block;
text-align:center;
}

ul.subnav{
position:absolute;
left:0px;
top:25px;
display:none;
width:900px;
}

.subnav li{
display:block;
width:100px;
height:25px;
text-align:center;
}

ul.menu li:hover ul{
display:block;
}

.visi{
display:block;
}

div{
position:absolute;
}

</style>

<script type=\"text/javascript\">
$(document).ready(function() {
$('ul.menu li').hover(function() {
$('ul.subnav').addClass('visi');
}, function() {
$('ul.subnav').removeClass('visi');
});
});

</script>


<title>JQuery</title>



</head>
<body>
<div>
<ul class=\"menu\">
	<li><a href=\"#\">Home</a></li>
	<li><a href=\"#\">Tutorials</a>
		<ul class=\"subnav\">
			<li><a href=\"#\">Sub Link</a></li>
			<li><a href=\"#\">Sub Link</a></li>
		</ul>
	</li>
	<li><a href=\"#\">Resources</a>
		<ul class=\"subnav\">
			<li><a href=\"#\">Sub Link 2</a></li>
			<li><a href=\"#\">Sub Link 2</a></li>
		</ul>
	</li>
	<li><a href=\"#\">About Us</a></li>
	<li><a href=\"#\">Contact Us</a></li>
</ul>

</div>
</body>
</html>

blue642

I don't have IE6 to help test, but I don;t see why with that jQuery it wouldn't work.

treehouse : what would you like to learn today?

Forums

jquery addclass , just a question.