<div class="all"> <p><a href="javascript:;" id="onvk">点击查看</a></p> <div class="tedg" style="background: gainsboro; height: 300px;"> </div> </div>
<style> *{ margin:0px; padding:0px; } .all{width:200px;position: fixed; bottom: 20px; left:40%;} .all p{width:200px; height:40px; border-radius:5px; border:1px solid #333;} .all p a{ float:right; width:70px; height:40px; line-height:40px; display:block; } .tedg{width:200px; border:1px solid #333; height:200px; display:none;} </style>
<script src="http://cdn.bootcss.com/jquery/1.8.3/jquery.min.js"></script> <script> $(function(){ $('#onvk').click(function(){ if($(this).text()=='点击查看'){ $(this).text('收起') }else{ $(this).text('点击查看') } $(this).parents('p').siblings('.tedg').stop().slideToggle(); /*找到#onvk的所有是p元素的祖先元素,.tedg的同辈元素,停止高度的变化*/ }) }) </script>
版权声明:除特别声明外,本站所有文章皆是本站原创,转载请以超链接形式注明出处!