可以自动轮换的页签 tabs with auto play fucntion

HTML、CSS方面改写了一下结构，用了一个DL javascript方面可以选择不断自动循环，或者只循环一次的，点击以后继续循环，或者停止循环

<title> <a href="https://www.kunjuke.com/tag/3930/" title="tabs" target="_blank">tabs</a> with auto <a href="https://www.kunjuke.com/tag/111603/" title="play" target="_blank">play</a> function </title> <!-- body,dl,dt,dd{font:12px/1.5em arial;padding:0;margin:0;} body{margin:25px;} img{border:0;} a:link{color:#369;text-decoration: none; } a:hover{color:#c83;} .tab{zoom:1;overflow:hidden;width:150px;border:1px solid #ccc;} .tab dt{float:left;width:50px;background: #eee;text-align: center;padding:2px 0;text-decoration: none;color:#666;cursor:pointer;} .tab dt a{text-decoration: none;color:#666;} .tab dt a:hover{text-decoration: none;color:#c83;} .tab dt.on, .tab dt.on a, .tab dt:hover{background: #fff;color:#c83;} .tab dd{display:none;clear:both;} .tab dd.on{display:block;} .tab dd img{display:block;padding-top:3px;height: 93px;width: 150px;} .tab dd a{padding:5px;} --> </p> <dl id="tab_01" class="tab"> <dt id="tab_01">tab_01</dt> <dt id="tab_02">tab_02</dt> <dt id="tab_03">tab_03</dt> <dd id="tabs_01">link1</dd> <dd id="tabs_02">link2</dd> <dd id="tabs_03">link3</dd> </dl> <p>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
<title>a1 a2 a3</title> <!-- *{font:12px/1.5em arial;} img{border:0;} a:link{color:#369;text-decoration: none; } a:hover{color:#c83;} #tt{zoom:1;overflow:hidden;width:152px;border:1px solid #ccc;border-width:1px 1px 0;} #tt a{float:left;width:50px;background: #eee;text-align: center;padding:2px 0;text-decoration: none;color:#666; } #tt a.on, #tt a:hover{background: #fff;color:#c83;} #ct{width:150px;border:1px solid #ccc;border-width:0 1px 1px;} #ct div{display:none;} #ct div.on{display:block;} #ct img{display:block;padding-top:3px;height: 93px;width: 150px;} #ct a{padding:5px;} --> a1a2a3 作品4249 作品4240 作品4245
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

以上就是可以自动轮换的页签 tabs with auto play fucntion的详细内容，更多请关注本站其它相关文章！