jquery的UI插件tabs

magic_dreamer

于 2010-01-19 17:50:35 发布

阅读量100

点赞数

分类专栏： UI 文章标签： UI jQuery XHTML HTML ViewUI

本文链接：https://blog.csdn.net/magic_dreamer/article/details/83531417

版权

UI 专栏收录该内容

122 篇文章 0 订阅

订阅专栏

jquery的UI插件tabs

其实我在下载jquery ui的时候，已经是下载的完整包了。
参考如下页面效果，view source仿造它的源码。
http://www.stilbuero.de/jquery/tabs/#remote-tab-1

在test下创立了一个最简单的demo效果tabs-demo.html如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery tabs</title>
<link rel="stylesheet" type="text/css" media="screen"
href="../components/jqgrid/css/ui-lightness/jquery-ui-1.7.2.custom.css" />
<style>
html,body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>

<script src="../components/jquery/jquery-1.3.2.min.js"
type="text/javascript"></script>
<script src="../components/jqgrid/js/jquery-ui-1.7.2.custom.min.js"
type="text/javascript"></script>

<script type="text/javascript">
$(function() {
$('#container-1').tabs( {
fxAutoHeight : true
});
});
</script>
</head>
<body>
<h2>Simple Tabs</h2>
<div id="container-1">
<ul>
<li><a href="#fragment-1"><span>One</span></a></li>
<li><a href="#fragment-2"><span>Two</span></a></li>
</ul>
<div id="fragment-1">test1</div>
<div id="fragment-2">test2</div>
</div>
</body>
</html>

magic_dreamer

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery的UI插件tabs

jquery的UI插件tabs其实我在下载jquery ui的时候，已经是下载的完整包了。参考如下页面效果，view source仿造它的源码。http://www.stilbuero.de/jquery/tabs/#remote-tab-1在test下创立了一个最简单的demo效果tabs-demo.html如下：jquery tabsht...
复制链接

扫一扫