slideDown时按下底部div

时间:2013-08-14 17:26:44

标签: javascript jquery jquery-ui

我希望这是一个简单的问题我试图在我的新元素向下滑动时按下我的底行上的div

这是一个与我小提琴的链接

http://jsfiddle.net/abtPH/

继承人我的jquery

  $('li').on('click', function(e){
    $(this).find('.outer').slideToggle();
  });

继承我的HTML

 <ul style="list-style: none;">
  <li>
   <div style="width: 156px; height: 156px; border: solid #cfcfcf 1px; padding: 10px; text-align: center; color: #cfcfcf;"> 156px X 156px</div>

   <div class="outer">
     <div class="inner">
    </div>   
   </div>
  </li>
 </ul>  

关于如何实现这一目标的任何想法?

1 个答案:

答案 0 :(得分:2)

在toggleClass上添加了jQuery UI。

http://jsfiddle.net/abtPH/3/

<强> JS

$('li').on('click', function(e){
  $(this).find('.outer').slideToggle();
  $(this).toggleClass('active', 400);
});

<强> CSS

.outer{position: absolute; width: 100%; background: black; top: auto; display: none; text-align: left;}
li.active {margin-bottom:100px;}