已经调整了一些编码 - 更喜欢标签导航 - 将div保持在原位而不是翻到顶部并失去位置。
因此,当点击导航标签时 - 它弹出到该区域并将标题/标签放在上面的位置。所以基本上只想保持导航清洁和静止......
任何想法/想法都赞赏..
<script type="text/javascript" src="addclasskillclass.js"></script>
<script type="text/javascript" src="attachevent.js"></script>
<script type="text/javascript" src="addcss.js"></script>
<script type="text/javascript" src="tabtastic.js"></script>
<STYLE type="text/css">
.tabset_tabs { margin:0; padding:0; list-style-type:none; position:relative; white-space:nowrap }
.tabset_tabs li { margin-left: 1%; padding:2px; display:inline }
.tabset_tabs a {
font-family: Verdana; font-size: 12pt; font-weight: normal;
color:#fff ! important;
<cfoutput>background-color:#set.fcol#; ! important; </cfoutput>
border:1px solid #99c;
text-decoration:none;
padding-left:7px;
padding-right:7px;
border-left-width:1px;
border-bottom:none
}
.tabset_tabs a:hover { color:pink ! important; background-color:#eff ! important }
<cfoutput>
.tabset_tabs a.active {
color:fff ! important;
background-color:#set.bcol# ! important;
border-color:black;
border-left-width:1px;
cursor:default;
border-bottom:white;
padding-left:7px;
padding-right:7px;
}
</cfoutput>
.tabset_tabs li.firstchild a { border-left-width:1px }
.tabset_content {
margin-left:1%;
margin-right:1%;
border:1px solid black;
background-color:white;
position:relative;
z-index:1;
padding:5px;
display:none }
.tabset_label { display:none }
.tabset_content_active {
display:block;
padding:5px;
<cfoutput>background-color:#set.fcol#; ! important; </cfoutput>
}
@media aural{
.tabset_content,
.tabset_label { display:block }
}
</style>
<ul class="tabset_tabs">
<li><a href="#sg" class="active"><b>Signed Up</b></a></li>
<li><a href="#r"><b>Requests</b></a></li>
<li><a href="#f"><b>Finance</b></a></li>
<li><a href="#s"><b>Settings</b></a></li>
</ul>
<div id="sg" class="tabset_content">
<br>
Stuff Here
<br>
</div>
<div id="r" class="tabset_content">
<br>
Other Stuff Here...
<br>
</div>
<div id="f" class="tabset_content">
<br>
Even More Stuff
<br>
</div>