JQuery SerialScroll Tabs 底部边框问题

标签 jquery css

我已经实现了类似于滚动标签的 SerialScroll:

http://jsfiddle.net/NinjaSk8ter/WvpcR/

我想以某种方式消除显示在加载中的每个选项卡之间的小底部边框:

enter image description here

之所以看不到底部边框一直在选项卡下方,是因为每个 .navigations li 底部边框最初都设置为 -1:

#mid-featureleft-client .navigations li{
float: left;
margin:0 3px -1px 0;
position: relative;
}

然后点击功能使底部边框出现在那些未被选中的选项卡下方:

enter image description here

最好的解决方案是在加载时或在 Init 函数中始终选择第一个选项卡,然后让底部边框一直显示在那些未选中的选项卡的底部。

有人知道我该如何实现吗?

enter image description here

最佳答案

要解决您的问题,您应该在此处的 css 类中将 margin-bottom 值设置为 0。

#mid-featureleft-client .navigations li{
float: left;
margin:0 3px 0 0;
position: relative;
}

然后,您应该将“margin-bottom:-1px”添加到白色类。

.white {   
    border-top: 1px solid #C6C6C6;
    border-left: 1px solid #C6C6C6;    
    border-right: 1px solid #C6C6C6;    
    background-color: #F7F7F7; 
    margin-bottom:-1px;
} 

http://jsfiddle.net/WvpcR/25/

关于JQuery SerialScroll Tabs 底部边框问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9303975/

相关文章:

javascript - Ajax调用完成后执行函数

jquery - 我可以将 jQuery pjax 与backbone.js 一起使用吗

css - 使用整个图片作为 div 标签的边框

html - 如何使用 Bootstrap 使谷歌地图全宽?

css - Align 属性在 HTML5 中仍然可用吗?

asp.net - 如何根据当前页面文件名更改超链接 CssClass(vb.net、asp.net)

javascript - jQuery 函数在调整窗口大小之前不会触发

php - 如何在jquery数据表的ajax调用中发布参数

javascript - 检查数组中的第一项是否为空值

css - Chrome 中的 SVG 填充神器