用JS编写选项卡效果用JS编写选项卡效果

本文实例为大家分享了JS编写选项卡效果的具体代码，供大家参考，具体内容如下

*{padding:0; margin:0; }.selectka {width:500px; height:400px; margin:auto; border:1px solid #09e1ff; }.left,.right{float:left; height:400px; }#menu{text-align: center; line-height: 80px; font-size: 20px; color:purple; }li{list-style: none; }#menu>li{width:100px; height:80px; border:1px dashed blueviolet; box-sizing: border-box; }.right{position: relative; width:399px; background: pink; margin-left:1px; text-align: center; font-size: 100px; line-height: 400px; }.right li{position: absolute; width:399px; height:400px; display: none; }
衣服
美妆
包包
美食
首饰
衣服
美妆
包包
美食
首饰

【用JS编写选项卡效果】效果图：