446day（突出展示案例，手风琴案例）

《2018年12月24日》【连续446天】

标题：突出展示案例，手风琴案例；
内容：

<div class="wrap">
  <ul>
    <li><a href="#"><img src="images/01.jpg" alt=""/></a></li>
    <li><a href="#"><img src="images/02.jpg" alt=""/></a></li>
    <li><a href="#"><img src="images/03.jpg" alt=""/></a></li>
    <li><a href="#"><img src="images/04.jpg" alt=""/></a></li>
    <li><a href="#"><img src="images/05.jpg" alt=""/></a></li>
    <li><a href="#"><img src="images/06.jpg" alt=""/></a></li>
  </ul>
</div>
<script>
  $(function() {
    $(".wrap li").mouseenter(function(){
      $(this).css("opacity",'1').siblings().css("opacity",'.4');
    });
    $(".wrap").mouseleave(function(){
      $(this).find('li').css("opacity",'1');
    });
  });
</script>

<ul class="parentWrap">
  <li class="menuGroup">
    <span class="groupTitle">标题1</span>
    <div>我是弹出来的div1</div>
  </li>
  <li class="menuGroup">
    <span class="groupTitle">标题2</span>
    <div>我是弹出来的div2</div>
  </li>
  <li class="menuGroup">
    <span class="groupTitle">标题3</span>
    <div>我是弹出来的div3</div>
  </li>
  <li class="menuGroup">
    <span class="groupTitle">标题4</span>
    <div>我是弹出来的div4</div>
  </li>
</ul>
<script>
  $(function () {
       $(".groupTitle").click(function () {
        $(this).next().slideDown(200).parent().siblings().children("div").slideUp(200);
      });
  });
</script>