`
ynial
  • 浏览: 227954 次
  • 来自: ...
社区版块
存档分类
最新评论

jquery 在覆盖层上处理tabview

阅读更多
【在覆盖层上处理tabview】


在各式各样的业务中、覆盖层的使用给我们带来了很多的方便;tabview也不例外,在比较特殊的业务中需要处理覆盖层上显示tabview;我选择两个JQUERY的插件。

在适当的位置上下载插件的例子。
需要导入的js \ css文件
        <script src="jquery-1.1.3.1.pack.js" type="text/javascript"></script>
        <script src="thickbox-compressed.js" type="text/javascript"></script>
        <script src="jquery.history_remote.pack.js" type="text/javascript"></script>
        <script src="jquery.tabs.pack.js" type="text/javascript"></script>
        <link rel="stylesheet" href="jquery.tabs.css" type="text/css" media="print, projection, screen">
        <link rel="stylesheet" href="thickbox.css" type="text/css" media="print, projection, screen">

js代码 十分的简单
        <script type="text/javascript">
            $(function() {
                $('#container-1').tabs();
            });
        </script>


覆盖层的超链接
	<a href="#TB_inline?height=455&width=600&inlineId=dispalyDIV&modal=true" class="thickbox">弹出层</a>

弹出层里的HTML代码
<div id="displayDIV" style="display:none">
	        <div id="container-1">
	            <ul>
	                <li><a href="#fragment-1"><span>默认文件夹</span></a></li>
	                <li><a href="#fragment-2"><span>Java文件夹</span></a></li>
	                <li><a href="#fragment-3"><span>.net文件夹</span></a></li>
	            </ul>
	            <div id="fragment-1">
	                <p>默认文件夹</p>
	                <pre><code>$(&#039;#container&#039;).tabs();</code></pre>
	            </div>
	            <div id="fragment-2">
	               <P>java文件夹</P>
	            </div>
	            <div id="fragment-3">
	                <P>.net文件夹</P>
	            </div>
	        </div>
分享到:
评论

相关推荐

    QML-TabView竖直方向

    在这个特定的场景中,我们关注的是`TabView`在竖直方向上的实现,即标签是垂直排列的,而不是传统上常见的水平排列。这在某些设计中可能是更理想的选择,例如当空间有限或者为了提供独特的用户体验时。 `TabView`的...

    jquery tab插件

    在开始讨论jQuery Tab插件之前,我们需要了解jQuery的基础。jQuery简化了DOM操作、事件处理、动画以及Ajax交互等任务。通过一句简单的`$(document).ready(function() {...})`,我们可以确保在页面加载完成后执行...

    android仿IOS tabview效果

    - **滑动监听**:设置`TabLayout.addOnTabSelectedListener`,监听用户在Tab上的滑动事件,以便进行相应的业务逻辑处理。 3. **布局集成**: - 将自定义的TabLayout和ViewPager结合,通常在XML布局文件中将它们...

    TabView的例子

    在网页设计和开发中,`TabView` 是一个常见的组件,它允许用户通过点击不同的标签来切换显示不同的内容区域。这种交互方式提高了用户体验,因为它们可以更有效地组织和浏览大量信息,而不会让页面显得过于混乱。在这...

    TabView的horizontalview实现

    这在一些设计上可能更具创新性,可以提供独特的用户体验,尤其是在屏幕空间有限或需要横向浏览大量内容的应用中。 首先,要实现`horizontal`的`TabView`,开发者通常会利用`UICollectionView`或者`UIStackView`,...

    自己封装的TabView

    android系统提供的只有tabActivity里面的tabhost,若想在一个普通activity里添加tab页,则必须自己写一个tabview,小弟特地用viewflipper和一个linearlayout封装一个tabview,方便大家,也方便自己以后重用。

    多文档的Tabview示例

    4. **关联Tab页与子窗口**:当用户在Tab控件上点击一个新标签时,应该创建一个新的子窗口并将其与Tab页关联。同时,已经存在的子窗口应能在对应的Tab页中正确显示。 5. **处理用户交互**:添加事件处理程序来响应...

    TabView

    在处理动态数据时,`TabView`同样表现出色。你可以使用数组和`ForEach`结构来动态生成选项卡。例如,如果你有一个数组存储了多个项目,你可以这样做: ```swift struct ContentView: View { let items = ["项目1",...

    多选TabView的实现

    在本示例"多选TabView的实现"中,我们将会探讨如何通过重写`UITableViewCell`的布尔值属性来扩展`UITableView`,使其具备多选功能。 首先,我们要创建一个自定义的`UITableViewCell`子类,比如叫做`...

    自定义TabView

    在处理自定义View时,注意以下优化点: - 尽量减少`ondraw()`中的计算,因为该方法会被频繁调用。 - 使用`invalidate()`方法通知系统重新绘制视图,但应避免过度调用,以防止不必要的性能消耗。 - 如果Tab数量较多,...

    在分割窗口中创建TabView的实现方法

    ### 在分割窗口中创建TabView的实现方法 #### 前言 标签控件(TabControl)是Visual C++编程中常用的控件之一,能够帮助开发者有效地利用有限的对话框空间来展示更多内容。通常情况下,我们会将标签控件放置在...

    tabview实现源码 mfc

    "Tabview实现源码 MFC"是关于如何使用MFC来创建一个带有标签控件(TabCtrl)的用户界面,使得用户可以通过不同的标签页在多个视图(View)之间进行切换。这种设计常见于许多应用中,如设置窗口、多文档界面(MDI)...

    Symbian中TabView的用法

    你可以根据需要调整布局,确保TabView在不同屏幕尺寸上都能正确显示。 6. **示例代码**: 提供的压缩包文件可能包含了一些示例项目,如"S60_Platform_Utilizing_External_Application_Views_v2_1_en.pdf"可能解释了...

    自定义 tabview(滑动的 tab)

    自定义tabView;主要实现可以丝滑的滑动切换tab

    SwiftUI编程实现不同TabView标签页中任意导航层级视图之间相互跳转的演示代码

    该资源是 编程实现不同TabView标签页中任意导航层级视图之间相互跳转&gt;&gt; 博文的配套源代码,博文链接地址如下: https://blog.csdn.net/mydo/article/details/123754090 在本篇博文中,您将学到以下内容: 如何实现...

    用VC实现的tabview

    【标题】"用VC实现的tabview" 是一个基于Microsoft Visual C++(VC++)开发的项目,旨在创建一个TabView组件,它允许在单一视图内嵌套多个子窗体,提供类似浏览器标签页的功能。这样的设计可以有效利用屏幕空间,...

    SwiftUI TabView 构建滚动轮播图PagedTabViewStyle

    SwiftUI TabView 构建滚动轮播图.1、在分页工具栏呈现半透明背景 PageIndexViewStyle(backgroundDisplayMode: .always)。2、创建页面滚动视图 tabViewStyle(PageTabViewStyle())

    模仿新版手Q底部TabView

    在移动应用设计中,底部TabView是一种常见的导航模式,它让用户能够轻松地在应用的不同功能模块之间切换。本文将深入探讨如何模仿新版手Q(腾讯QQ)底部的TabView,尤其是其独特的icon跟随手指移动的效果。 首先,...

    Root.TabView

    通过JavaScript,"Root.TabView"能够实现在用户的浏览器上动态生成和操作标签页,包括添加、删除、切换标签等操作,无需服务器端交互。 压缩包内的文件如下: 1. **TabView.htm**:这是一个HTML文件,很可能包含了...

    Visual C++中TabView的多种实现方法

    在Visual C++中,TabView是一种常见的界面设计模式,用于实现多个视图或页面的便捷切换。本篇文章将详细介绍由周京生撰写的期刊文章《Visual C++中TabView的多种实现方法》,该文章探讨了三种不同的TabView实现方式...

Global site tag (gtag.js) - Google Analytics