标签页导航
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style> .title { width:100px;height:30px;border:1px solid red; margin:3px;float:left; } .content { width:420px;height:300px;border:1px solid blue; clear:both; } </style> <script src="scripts/jquery-1.7.1.js"></script> <script> $(function () { $('.title').mouseover(function () { var index = $(this).index(); var divContent=$('.content') switch (index) { case 0: divContent.html('<h1>00000000</h1>'); break; case 1: divContent.html('<h1>111111</h1>'); break; case 2: divContent.html('<h1>22222222</h1>'); break; case 3: divContent.html('<h1>333333333</h1>'); break; } }); }); </script> </head> <body> <div class="title">一带一路</div> <div class="title">互联网+</div> <div class="title">亚投行</div> <div class="title">京津冀一体化</div> <div class="content"></div> </body> </html>
作者:一个大西瓜
-------------------------------------------
个性签名:独学而无友,则孤陋而寡闻。做一个灵魂有趣的人!
如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,博主在此感谢!
万水千山总是情,打赏一分行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主,哈哈哈(っ•̀ω•́)っ✎⁾⁾!
![](https://www.cnblogs.com/images/cnblogs_com/wyt007/1375409/t_alipay.bmp)
![](https://www.cnblogs.com/images/cnblogs_com/wyt007/1375409/t_wxpay.bmp)