定位jquery标签和框的问题 [英] Problem in positioning the jquery tabs and boxes
问题描述
我使用过jquery标签和手风琴。代码如下：
I have used jquery tabs and accordion.The code is as follows:
<html>
<head>
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.12.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.ui.core.js"></script>
<script type="text/javascript" src="js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/jquery.ui.resizable.js"></script>
<script type="text/javascript" src="js/jquery.ui.tabs.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/chat.js"></script>
<link type="stylesheet" href="css/jquery.ui.dialog.css"></link>
<link
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery- ui.css"
rel="stylesheet" type="text/css" />
<link type="stylesheet" href="styles/items.css"></link>
</head>
<script>
//tabs
$(function() {
$( "#content-area" ).tabs();
$("#content-area").resizable();
$("#content-area").draggable();
});
//button
$(function() {
$( "button, input:submit, a", ".demo" ).button();
//$( "a", ".demo" ).click(function() { return false; });
});
//resizable box
$(function() {
$( "#item-list" ).accordion({
fillSpace: true
});
});
$(function() {
$( "#item-list" ).resizable({
minHeight: 140,
resize: function() {
$( "#item" ).accordion( "resize" );
}
});
});
</script>
</head>
<body>
<div class="demo">
<div class="toolbar">
<input value="AddItems" type="submit">
<input value="LogOut" type="submit">
</div>
<br></br>
<div id=content-area">
<ul>
<li><a href="#tabs-1">catalog</a></li>
</ul>
<div id="jw">
<p>hii</p>
</div>
</div>
<br></br>
<div id="item-list" class="ui-widget-content">
<div id="items">
<h3><a href="#">ItemsList</a></h3>
<div>
<p>item list here</p>
</div>
</div>
</div>
</div>
</body>
</html>
文件具有：
#content-area {
float:left
width: 350px;
height: 450px;
padding: 0.5em
}
#item-list {
float:right
width: 150px;
height: 150px;
padding: 0.5em;
}
#item h3 {
text-align: center;
margin: 0;
}
当我运行应用程序选项卡和手风琴盒是一个在另一个下面。我想当我在css中指定它的位置和大小不适用
when I run the application tabs and the accordion box are one below the other.I want the tabs to be on left and box on the right.Even when I have specified it in css the positioning as well as the sizing is not applied
推荐答案
您会考虑使用预先编写的内容，例如： http://nicolahibbert.com/demo/ liteAccordion / 或 http：//letmehaveblog.blogspot。 com / 2007/10 / haccordion-simple-horizontal-accordion.html 或 http：/ /www.marghoobsuleman.com/jQuery-common-accordion 。如果你搜索水平手风琴jquery，你将能够找到更多。
Would you consider using something pre-written such as: http://nicolahibbert.com/demo/liteAccordion/ or http://letmehaveblog.blogspot.com/2007/10/haccordion-simple-horizontal-accordion.html or http://www.marghoobsuleman.com/jQuery-common-accordion. You'll be able to find more if you search for "horizontal accordion jquery" perhaps.
这篇关于定位jquery标签和框的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
