javascript實作tabs選項卡切換效果(自寫原生js)_javascript技巧
- WBOY原創
- 2016-05-16 17:40:071670瀏覽
現在的頁面上有許多各種各樣的頁面效果，常用的有彈出層效果，無縫滾動效果，選項卡切換效果。今天分享一款自己用原生javascript寫的選項卡切換效果，由於本人水平有限，如有問題請指出。
效果圖如下：
html代碼：
複製代碼
複製代碼
複製代碼
程式碼如下:
a{color:#a0b3d6;}
.tabs{border:1px solid #a0b3d6;margin:100px;width:300px;}
tabs-nav a.tabs-nav a.tabs-nav a.tabs-nav a.tabs-nav a.tabs-nav a.tabs-nav a. {background:#eaf0fd;line-height:30px;padding:0 20px;display:inline-block;border-right:1px solid #a0b3d6;border-bottom:1px solid #a0b3d6;float:left; tabs-nav .on{background:white;border-bottom:1px solid white;_position:relative;}
.tabs-content{padding:20px;border-top:1px solid #a0b3d6;margin-top:-1px ;}
1111111111111111111111111111111111
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn