<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jOrgChart - A jQuery OrgChart Plugin</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/jquery.jOrgChart.css"/>
<link rel="stylesheet" type="text/css" href="css/custom.css"/>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.jOrgChart.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
$("#org").jOrgChart({
chartElement : '#chart',
dragAndDrop : false
});
});
</script>
</head>
<body onload="">
<div class="topbar">
<div class="topbar-inner">
<div class="container">
<a class="brand" href="#">jQuery Organisation Chart</a>
</div>
</div>
</div>
<ul id="org" style="display:none">
<li>
股票
<ul>
<li id="beer">深A</li>
<li>新三板<a href="http://wesnolte.com" target="_blank">Click me</a>
<ul>
<li>新1</li>
<li>
<a href="http://tquila.com" target="_blank">新2</a>
<p>A link and paragraph is all we need.</p>
</li>
</ul>
</li>
<li class="fruit">沪A
<ul>
<li>大蓝筹
<ul>
<li>Granny Smith</li>
</ul>
</li>
<li>工业4.0
<ul>
<li>Blueberry</li>
<li><img src="images/raspberry.jpg" alt="Raspberry"/></li>
<li>Cucumber</li>
</ul>
</li>
</ul>
</li>
<li>中小板</li>
<li class="collapsed">创业板
<ul>
<li>Topdeck</li>
<li>Reese's Cups</li>
</ul>
</li>
</ul>
</li>
</ul>
<div id="chart" class="orgChart"></div>
</body>
</html>
相关推荐
描述中的“横向数据重复的插件横向数据重复的插件dw插件横向数据重复的插件dw插件”虽然重复，但我们可以理解为强调这个插件的功能是处理数据表中的横向重复数据。横向数据重复通常指的是在同一列或者相关联的列中...
本示例关注的是“横向组织架构图”，这种类型的架构图通常以水平的方式展示节点，使得层级关系一目了然。在JavaScript（JS）和jQuery的帮助下，我们可以创建动态的、交互式的组织架构图，支持用户操作如新增、删除、...
而“jQuery横向动态滑动导航菜单插件”则为开发者提供了一种高效且吸引人的解决方案，使得网页的导航功能更加直观和互动。这个插件特别适用于那些希望提升用户体验，增加网站视觉吸引力的设计师和开发者。 jQuery是...
在这个"vuejsTime横向时间年月日星期插件"中，我们讨论的是如何在Vue.js项目中实现一个能够展示横向时间轴，包含年、月、日和星期的功能。 首先，我们需要理解这个插件的核心功能。横向时间轴通常用于展示时间序列...
《jQuery刻度尺风格横向时间轴插件timeline详解》 在网页设计中，时间轴是一种常见且有效的展示信息的方式，它能清晰地呈现事件的顺序和时间跨度。jQuery作为一款强大的JavaScript库，提供了丰富的功能来简化网页...
横向树和组织结构图是两种在信息技术领域中用于表示数据关系和层次结构的图形化工具。在JavaScript开发中，它们常被用来展示复杂的数据模型，如企业组织结构、项目管理或者系统架构等。 首先，我们来理解“横向树”...
《jQuery横向滚动时间轴插件详解》 在网页设计中，时间轴是一种常见的展示信息的方式，它能够清晰地展示事件的顺序和时间关系。jQuery作为一款广泛使用的JavaScript库，提供了丰富的插件来实现各种功能，其中包括...
JavaScript 横向树，又称为水平树或组织结构图，是一种常见的数据可视化方式，尤其在展示企业或团队的层级关系时非常有用。这种布局方式将树状结构自上而下展开，使得节点间的层次关系一目了然，且占用空间更少，...
**横向jQuery内容滚动插件Sly详解** 在网页设计中，动态内容滚动是一种常见的交互方式，它可以提升用户体验，使得大量信息能够以优雅的方式呈现。jQuery作为JavaScript库的翘楚，提供了丰富的插件来实现各种滚动...
**jQuery刻度尺风格横向时间轴插件timeline详解** 在Web开发中，视觉元素的创新和用户体验的提升是至关重要的。"jQuery刻度尺风格横向时间轴插件timeline"正是一款能够帮助开发者实现这一目标的工具。这款插件以其...
"实用的jQuery横向无限循环滚动插件"是一个专门为网页设计的动态效果插件，它允许网页上的内容（如图片、文本或产品展示）以横向无限循环的方式进行滚动，从而提供一种流畅且引人注目的用户体验。这种被称为"自动...
标题中的“横向时间轴插件_js_时间轴_”指的是一个使用JavaScript编写的，用于展示时间线的插件。在Web开发中，时间轴插件常用于以视觉化的方式展示事件序列，比如历史事件、项目进度或者新闻更新等。这个插件可能是...
**jQuery横向和纵向内容滚动插件Sly** 在网页设计中，内容滚动是一种常见的交互方式，它可以提升用户体验，尤其在处理大量信息时。jQuery作为一款强大的JavaScript库，提供了丰富的插件来实现各种滚动效果。其中，...
"ASP横向数据重复的插件"正是为了解决这一问题而设计的工具。 这个插件的核心功能在于它可以识别并处理数据库查询结果中的重复数据，特别是在横向展示（如表格列）时，确保每一行都是唯一的，避免了信息冗余。它...
在本项目中，我们主要关注的是如何利用ECharts库来创建一个横向展示的组织结构图，其中连接线呈现为曲线形状。ECharts是一款基于JavaScript的数据可视化库，它提供了丰富的图表类型，包括柱状图、折线图、饼图以及...
横向重复信息列表插件是一种用于增强用户界面体验的工具，特别是在网页设计或应用程序开发中。这个插件的主要目的是处理和展示数据，特别是那些可能存在横向重复信息的数据集。它通过高效地管理和显示这些信息，使...
jQuery横向时间轴插件timeline是一款用于网页中展示事件序列的高效工具，它通过直观的横向布局，将一系列事件按照时间顺序排列，使用户能够轻松浏览和理解这些事件的发展过程。这款插件基于流行的JavaScript库jQuery...
【PHP区域横向重复插件】是一种用于Web开发的工具，主要针对PHP编程语言设计，旨在帮助开发者检测并解决代码中的区域横向重复问题。在软件开发过程中，代码的重复可能导致不必要的资源消耗，降低程序效率，同时也...