<!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" />
<title>jQuery learning</title>
<script src="scripts/jquery-1.3.1.js"type="text/javascript"></script>
<style type="text/css">
.horizontal{
float:left;
list-style:none;
margin:10px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
S('#selected-plays > li').addClass('horizontal');
});
</script>
</head><body> <ul id="selected-plays">
<li>Comedies
<ul>
<li><a href="/asyoulikeit/">As You Like it</a></li>
<li>All's well That Ends Well</li>
<li>A Midaummer Night's Dream</li>
</ul>
<li>Tragedies
<ul>
<li><a href="/hamlet.pdf">Hamlet</a></li>
<li>Macbeth</li>
<li>romeo and Juliet</li>
</ul>
<li>Histories
<ul>
<li>Henry 5(<a href="mailto:[email protected]">email</a>)
<ul>
<li>Part 1</li>
<li>Part 2</li>
</ul>
<li><a href="http://www.shakespeare.co.uk/henryv.htm">Henry 5</a></li>
<li>Richard 2</li>
</ul>
</li>
</ul>
</body>
</html>代码的功能是实现让导航的顶级项水平排列。可是结果却依然是垂直排列。找了很久也不知道问题出在哪。
因为我也是刚学jQuery,只是看了下书的第一章，书上有个例题，不过只有关键部分代码，所以想自己上机实现下，没想到这么初级都调试部出来，惭愧！谢谢大家。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery learning</title>
<script src="scripts/jquery-1.3.1.js"type="text/javascript"></script>
<style type="text/css">
.horizontal{
float:left;
list-style:none;
margin:10px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
S('#selected-plays > li').addClass('horizontal');
});
</script>
</head><body> <ul id="selected-plays">
<li>Comedies
<ul>
<li><a href="/asyoulikeit/">As You Like it</a></li>
<li>All's well That Ends Well</li>
<li>A Midaummer Night's Dream</li>
</ul>
<li>Tragedies
<ul>
<li><a href="/hamlet.pdf">Hamlet</a></li>
<li>Macbeth</li>
<li>romeo and Juliet</li>
</ul>
<li>Histories
<ul>
<li>Henry 5(<a href="mailto:[email protected]">email</a>)
<ul>
<li>Part 1</li>
<li>Part 2</li>
</ul>
<li><a href="http://www.shakespeare.co.uk/henryv.htm">Henry 5</a></li>
<li>Richard 2</li>
</ul>
</li>
</ul>
</body>
</html>代码的功能是实现让导航的顶级项水平排列。可是结果却依然是垂直排列。找了很久也不知道问题出在哪。
因为我也是刚学jQuery,只是看了下书的第一章，书上有个例题，不过只有关键部分代码，所以想自己上机实现下，没想到这么初级都调试部出来，惭愧！谢谢大家。
<script type="text/javascript">
$(document).ready(function(){
S('#selected-plays > li').addClass('horizontal');
});
</script>
应该是
$('#selected-plays > li').addClass('horizontal');
$(document).ready(function(){
S('#selected-plays > li').addClass('horizontal');//这里不是S，是$美元符号，它是jQuery的一个功能函数
});
float:left;
list-style-type:none;
margin:10px;
}
#selected-plays li ul li{
height:18px;
clear:both;
}