↓↓选择一款你喜欢的背景皮肤吧!↓↓
{WEB前端技术分享,APP开发,PHP编程学习}
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <style type="text/css"> *{margin:0;padding:0;} ul li{ list-style:none;} img {border:0 none;} body {padding:100px;} input[type='button']{width:100px; height:38px;display:block;position:fixed;right:20%; top:50px;} dl{width:120px;float:left;margin:20px;} dl dt{border:1px blue solid; height:30px; cursor:pointer;} dl dd{height:90px; display:none;} </style> <script type="text/javascript"> $(function(){ $("input[type='button']").focus().click(function(){}) $("dl >dd:nth-child(2)").show().siblings('dd').hide(); // 2,4,6 是dd在其父元素dl 的位置,非指第几个匹配元素,区别于:eq(index)中的index $("dl >dt").each(function(i, element) { $(this).mouseover(function(){ $(this).next().show().siblings('dd').hide(); }) }); }) </script> <input type="button" value="点击测试"/> <dl> <dt>s1</dt> <dd>s1-1</dd> <dt>s2</dt> <dd>s2_1</dd> <dt>s3</dt> <dd>s3_1</dd> </dl> <dl> <dt>S1</dt> <dd>S1-1</dd> <dt>S2</dt> <dd>S2-1</dd> <dt>S3</dt> <dd>S3-1</dd> </dl>
提示:你可以先修改部分代码再运行。
如果你觉得本站文章不错,阅读完有所收获,欢迎捐赠赞助:
(*必填)
(选填)
[ 请确保填写正确的邮箱地址,您的留言审核通过会收到邮件通知! ]
[请申请gravatar头像,木有头像的评论可能不会被回复]
【查看更多】提示:发表说说,请登录
請求: /wp-comments-post.php
方式: 未經評論表格
內容: 博主很强大,我支持
— 記錄成功 —