jquery实现faq问答帮助中心tab菜单导航代码
代码语言：html
所属分类：选项卡
代码描述：jquery实现faq问答帮助中心tab菜单导航代码
代码标签： jquery faq 问答 帮助中心 tab 菜单 导航 代码
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<style>
body{
margin: 0;
padding:0;
}
.container{
font-family: 微软雅黑;
background: #fff;
padding: 30px;
margin:50px auto;
overflow: hidden;
}
.container .menu{
width: 240px;
margin-left: 130px;
float: left;
border-right: 1px solid #aaa;
}
/*position 菜单背景图标*/
.positionIicon{
display: inline block;
width: 32px;
height: 32px;
margin: 0px 4px;
float: left;
margin-right: 10px;
}
.container .menu h3{
font-size: 20px;
cursor: pointer;
}
.container .menu ul{
display: none;
}
.container .menu ul li{
height: 28px;
line-height: 28px;
}
.container .menu ul li a:hover{
background: #9FB6CD;
border-radius: 14px;
-webkit-border-radius: 14px;
-moz-border-radius: 14px;
-moz-border-radius:14px;
color:#fff;
}
ul{
list-style: none;
}
a{
text-decoration: none;
color: #000;
font-size: 14px;
display: block;
width: 180px;
height: 26px;
padding-left: 10px;
}
.container .menu .selected{
background: #ccc;
border-radius: 14px;
}
.container .content{
margin-top: 15px;
width: 860px;
margin-left: 400px;
}
.container .content .get-menu{
margin-left: -10px;
}
.container .content .get-menu a{
display: inline-block;
font-size: 15px;
height: 40px;
}
.container .content .get-menu a:last-child{
margin-left: -8px;
color: #7D9EC0;
}
.container .content .get-menu span{
display: inline-block;
height: 40px;
margin-left: -110px;
}
.container .content .menu1 .tab {
display: none;
}
.container .content .menu1 .active{
display: block;
}
.container .content .menu1 .tab p{
font-size: 14px;
line-height: 20px;
color: rgba(0,0,0,1);
word-break:break-all;
}
.container .content .menu1 .tab .tt{
font-size: 14px;
font-weight: bold;
}
/*第二个菜单下的文档内容*/
.container .content .menu2 .tab {
display: none;
}
.container .content .menu2 .active{
display: block;
}
.container .content .menu2 .tab p{
font-size: 14px;
line-height: 20px;
color: rgba(0,0,0,0.8);
word-break:break-all;
}
.container .content .menu2 .tab .tt{
font-size: 14px;
font-weight: bold;
}
/*第三个菜单下的文档内容*/
.container .content .menu3 .tab {
display: none;
}
.container .content .menu3 .active{
display: block;
}
.container .content .menu3 .tab p{
font-size: 14px;
line-height: 20px;
color: rgba(0,0,0,0.8);
word-break:break-all;
}
.container .content .menu3 .tab .tt{
font-size: 13px;
font-weight: bold;
}
</style>
</head>
<body>
<div class="container">
<div class="menu">
<h3><i class="fa fa-graduation-cap positionIicon"></i>快速上手</h3>
<ul class="ulmenu1">
<li><a class="selected" href="#tab1">基础问题</a></li>
<li><a href="#">仪表盘</a></li>
<li><a href="#">事务处理</a></li>
<li><a href="#">财务处理</a></li>
<li><a href="#">报表</a></li>
<li><a href="#">系统设置</a></li>
</ul>
<h3><i class="fa fa-futbol-o positionIicon"></i>产品手册</h3>
<ul class="ulmenu2">
<li><a href="#" class="selected">基础问题</a></li>
<li><a href="#">操作环境</a></li>
<li><a href="#">科目问题</a></li>
<li><a href="#">期初问题</a></li>
<li><a href="#">期末结转类凭证问题</a></li>
<li><a href="#">凭证问题</a></li>
<li><a href="#">报表</a></li>
<li><a href="#">数量金额计算</a></li>
<li><a href="#">账套信息</a></li>
<li><a href="#">小规模纳税人和一般纳税人</a></li>
<li><a href="#">打印问题</a></li>
<li><a href="#">固定资产问题</a></li>
</ul>
<h3><i class="fa fa-windows positionIicon"></i>常见问题</h3>
<ul class="ulmenu3">
<li><a class="selected" href="#tab1">基础问题</a></li>
<li><a href="#">操作环境</a></li>
<li><a href="#">科目问题</a></li>
<li><a href="#tab3">期初问题</a></li>
<li><a href="#tab4">期末结转类凭证问题</a></li>
<li><a href="#tab5">凭证问题</a></li>
<li><a href="#">报表</a></li>
<li><a href="#">数量金额计算</a></li>
<li><a href="#">账套信息</a></li>
<li><a href="#">小规模纳税人和一般纳税人</a></li>
<li><a href="#">打印问题</a></li>
<li><a href="#">固定资产问题</a></li>
</ul>
</div>
<div class="content">
<div class="get-menu">
<a href="#">帮助中心</a>
<span>></span>
<a class="A1" href="#">常见问题</a>
</div>
<div class="menu1 menu_tab">
<div id="tab1" class="tab active">
<p class="tt">1.是如何收费？</p>
<p>This is Answer！1.是如何收费？？1.是如何收费？？1.是如何收费？？1.是如何收费？？1.是如何收费？？</p>
<p class="tt">2.安全吗？</p>
<p>This is Answer！2.安全吗？2.安全吗？2.安全吗？2.安全吗？2.安全吗？2.安全吗？2.安全吗？</p>
<p class="tt">3.的数据能否保存？</p>
<p>的数据能否保存？的数据能否保存？的数据能否保存？</p>
<p>的数据能否保存？</p>
</div>
<div id="tab2" class="tab">
<p class="tt">4.快乐加账号余额与银行账号余额不一致？</p>
<p>This is Answer！4.快乐加账号余额与银行账号余额不一致？4.快乐加账号余额与银行账号余额不一致？4.快乐加账号余额与银行账号余额不一致？</p>
<p class="tt">5.手工凭证的银行收付转能为什么不能反应到仪表盘？</p>
<p>This is Answer！5.手工凭证的银行收付转能为什么不能反应到仪表盘？5.手工凭证的银行收付转能为什么不能反应到仪表盘？5.手工凭证的银行收付转能为什么不能反应到仪表盘？5.手工凭证的银行收付转能为什么不能反应到仪表盘？</p>
</div>
<div id="tab3" class="tab">
<p class="tt">6.新增银行账号处”是否现金账户”什么意思？</p>
<p>This is Answer！6.新增银行账号处”是否现金账户”什么意思？6.新增银行账号处”是否现金账户”什么意思？</p>
<p class="tt">7.事务处理处生成的凭证属于哪个会计期间的？？</p>
<p>This is Answer！7.事务处理处生成的凭证属于哪个会计期间的？？7.事务处理处生成的凭证属于哪个会计期间的？？7.事务处理处生成的凭证属于哪个会计期间的？？7.事务处理处生成的凭证属于哪个会计期间的？？7.事务处理处生成的凭证属于哪个会计期间的？？</p>
<p class="tt">8.凭单与费用报销单有什么区别？</p>
<p>This is Answer！8.凭单与费用报销单有什么区别？8.凭单与费用报销单有什么区别？8.凭单与费用报销单有什么区别？8.凭单与费用报销单有什么区别？</p>
<p class="tt">9.财务复核的时候若发现上交的发票与报销不符，在系统该怎么操作？</p>
<p>This is Answer！9.财务复核的时候若发现上交的发票与报销不符，在系统该怎么操作？9.财务复核的时候若发现上交的发票与报销不符，在系统该怎么操作？9.财务复核的时候若发现上交的发票与报销不符，在系统该怎么操作？</p>
<p class="tt">10.费用报销个步骤中，哪个步骤会自动生成会计凭证？</p>
<p>This is Answer！10.费用报销个步骤中，哪个步骤会自动生成会计凭证？10.费用报销个步骤中，哪个步骤会自动生成会计凭证？10.费用报销个步骤中，哪个步骤会自动生成会计凭证？</p>
<p class="tt">11.已提交的报销单如发现填写错误能撤回吗？</p>
<p>This is Answer！11.已提交的报销单如发现填写错误能撤回吗？11.已提交的报销单如发现填写错误能撤回吗？11.已提交的报销单如发现填写错误能撤回吗？11.已提交的报销单如发现填写错误能撤回吗？</p>
<p class="tt">12.工资处理处社保公积金都能自动计算的吗？</p>
<p>This is Answer！12.工资处理处社保公积金都能自动计算的吗？</p>
</div>
<div id="tab4" class="tab">
<p class="tt">13.为什么关账后损益类科目还有余额？</p>
<p>This is Answer！</p>
<p class="tt">14.月末关账后发现凭证录入有误还能再修改吗？</p>
<p>月末关账后发现凭证录入有误还能再修改吗？月末关账后发现凭证录入有误还能再修改吗？月末关账后发现凭证录入有误还能再修改吗？</p>
<p class="tt">15.年结凭证需要自己手动录入吗</p>
<p>年结凭证需要自己手动录入吗年结凭证需要自己手动录入吗年结凭证需要自己手动录入吗年结凭证需要自己手动录入吗</p>
<p class="tt">16.系统能自动生成哪些凭证，哪些凭证需要手工录入？</p>
<p>系统能自动生成哪些凭证，哪些凭证需要手工录入？16、系统能自动生成哪些凭证，哪些凭证需要手工录入？？</p>
<p class="tt">17.在其他财务软件做的凭证能导入系统吗？</p>
<p>在其他财务软件做的凭证能导入系统吗？在其他财务软件做的凭证能导入系统吗？在其他财务软件做的凭证能导入系统吗？在其他财务软件做的凭证能导入系统吗？</p>
<p class="tt">18.为什么有些凭证不能删除？</p>
<p>为什么有些凭证不能删除？为什么有些凭证不能删除？</p>
<p class="tt">19.业务驱动收到或者开具的发票能删除吗？</p>
<p>业务驱动收到或者开具的发票能删除吗？19.业务驱动收到或者开具的发票能删除吗？19.业务驱动收到或者开具的发票能删除吗？</p>
<p class="tt">20.税收测算表的增值税及营业税以什么为根据来计算的？</p>
<p>税收测算表的增值税及营业税以什么为根据来计算的？税收测算表的增值税及营业税以什么为根据来计算的？税收测算表的增值税及营业税以什么为根据来计算的？</p>
<p class="tt">21.税收管理报表计提生成凭证后若发现计提错误还能修改吗？</p>
<p>税收管理报表计提生成凭证后若发现计提错误还能修改吗？21、税收管理报表计提生成凭证后若发现计提错误还能修改吗？21、税收管理报表计提生成凭证后若发现计提错误还能修改吗？</p>
</div>
<div id="tab5" class="tab">
<p class="tt">22.账龄表初始化是什么意思？</p>
<p>This is Answer！</p>
<p class="tt">23.在哪里可以查看明细帐？</p>
<p>在哪里可以查看明细帐？在哪里可以查看明细帐？在哪里可以查看明细帐？在哪里可以查看明细帐？</p>
<p class="tt">24.每生成一张凭证之后为什么三大报表及科目余额表都会改变？</p>
<p>每生成一张凭证之后为什么三大报表及科目余额表都会改变？每生成一张凭证之后为什么三大报表及科目余额表都会改变？每生成一张凭证之后为什么三大报表及科目余额表都会改变？每生成一张凭证之后为什么三大报表及科目余额表都会改变？</p>
<p class="tt">25.如何查看关账月份前的报表？</p>
<p>如何查看关账月份前的报表？如何查看关账月份前的报表？如何查看关账月份前的报表？</p>
</div>
<div id="tab6" class="tab">
<p class="tt">26.如何录入科目期初余额？</p>
<p>This is Answer！</p>
<p class="tt">27.初始化的时候期初余额录入错误怎么修改?</p>
<p>初始化的时候期初余额录入错误怎么修改?</p>
<p class="tt">28.初始化的时候科目余额为什么录入不进去？</p>
<p>初始化的时候科目余额为什么录入不进去？28、初始化的时候科目余额为什么录入不进去？28、初始化的时候科目余额为什么录入不进去？</p>
<p class="tt">29.科目匹配是什么意思？</p>
<p>科目匹配是什么意思？科目匹配是什么意思？科目匹配是什么意思？</p>
<p class="tt">30.为什么有些科目删除不了？</p>
<p>This is Answer！</p>
<p class="tt">31.如何增加一级科目？会计科目到几级？</p>
<p>如何增加一级科目？会计科目到几级？如何增加一级科目？会计科目到几级？如何增加一级科目？会计科目到几级？如何增加一级科目？会计科目到几级？</p>
<p class="tt">32.如何增加、修改、删除科目？</p>
<p>如何增加、修改、删除科目？如何增加、修改、删除科目？如何增加、修改、删除科目？如何增加、修改、删除科目？如何增加、修改、删除科目？如何增加、修改、删除科目？</p>
<p class="tt">33. 科目是按照哪个企业会计准则来的？</p>
<p>科目是按照哪个企业会计准则来的？科目是按照哪个企业会计准则来的？科目是按照哪个企业会计准则来的？科目是按照哪个企业会计准则来的？</p>
<p class="tt">34.是否支持辅助核算？如何核算每个客户或者供应商的往来款项？</p>
<p>This is Answer！</p>
<p class="tt">35.若员工离职了，如何把该员工从系统中删除？</p>
<p>若员工离职了，如何把该员工从系统中删除若员工离职了，如何把该员工从系统中删除若员工离职了，如何把该员工从系统中删除？</p>
<p class="tt">36.如何修改报销审批人？</p>
<p>如何修改报销审批人？36、如何修改报销审批人？36、如何修改报销审批人？</p>
<p class="tt">37.员工个人信息如何修改？</p>
<p>员工个人信息如何修改员工个人信息如何修改员工个人信息如何修改员工个人信息如何修改</p>
</div>
</div>
<div class="menu2 menu_tab">
<div id="tab-1" class="tab">
<p class="tt">1. Question</p>
<p>This is Answer！</p>
<p class="tt">2. Question</p>
<p>This is Answer！</p>
<p class="tt">3. Question</p>
<p>This is Answer！</p>
<p>This is Answer！</p>
</div>
<div id="ta-2" class="tab">
.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0