您现在的位置是:首页 > 学无止境> JS网站首页学无止境JS
jQuery Tab标签自动切换
- JS
- 2019-08-12
- 1844已阅读
简介
jQuery Tab标签自动切换代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>jQuery Tab标签自动切换</title> <link type="text/css" href="css/style.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/tab_zd.js"></script> </head> <body> <div class="tab"> <ul id="list_mark"> <li>第一页</li> <li>第二页</li> <li>第三页</li> </ul> <div class="tab_con"> <div class="list1">第一页内容</div> <div class="list1">第二页内容</div> <div class="list1">第三页内容</div> </div> </div> </body> </html>
默认自动切换,同时鼠标划过或鼠标点击也可以切换,只需将tab_zd.js里
$('#list_mark li').hover(
改为
$('#list_mark li').click(
就可以了。
在线预览:jQuery Tab标签自动切换
点击下载:tabzdqh.zip
上一篇:层叠卡片幻灯片切换效果