<!--//...弹出菜单 0.03.10 -->
<div id="menuTab" class="pf ltrb fz13 pf lrt z500 " style="top:1.33rem;display:none;overflow:hidden;">
  <div class="bg_f pr z100 pb20 t_center cursor content plr10" f="but_close_tab" style="animation-duration:300ms;">
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_index.png" /></dt>
      <dd class="lh30">首页</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=user">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_user.png" /></dt>
      <dd class="lh30">会员</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=party" data-type="offtab">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_party.png"/></dt>
      <dd class="lh30">活动</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=dynamic">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_dynamic.png" /></dt>
      <dd class="lh30">动态</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=diary">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_diary.png" /></dt>
      <dd class="lh30">日记</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=story">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_story.png" /></dt>
      <dd class="lh30">案例</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=article">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_article.png" /></dt>
      <dd class="lh30">婚恋课堂</dd>
    </dl>
    </a>
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=kefu">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_kefu.png" /></dt>
      <dd class="lh30">联系客服</dd>
    </dl>
    </a>
    <!--//21.04.25 -->
    <a class="inline_block w25 fl pt5" href="<!--{$oefile}-->&c=emtest">
    <dl>
      <dt><img class="pt10" style="width:1.12rem" src="<!--{$wapskin}-->images/ico/nav_test.png" /></dt>
      <dd class="lh30">情感测试</dd>
    </dl>
    </a>
    <div class="clear"></div>
  </div>
  <div class="close bg_tran cursor pa ltrb"  f="but_show_offtab" style="animation-duration:300ms;"></div>
</div>
<script type="text/javascript">
$(function(){
    //头部菜单导航
    $(document).on("click", "[f='but_open_menutab']", function(){
        
        //0.05.19
        var $tab_type = $(this).attr("data-type");
        if ($tab_type == 'undefined') {
            $tab_type = '';
        }
        if ($tab_type == 'home') {
            $("#menuTab").css("top", '0rem');
        }
        else if ($tab_type == 'other') {
            $("#menuTab").css("top", '1.28rem');
        }
        
    
        if ($("#menuTab").css('display') == 'none') {
            $("#menuTab").show();
            $("#menuTab .content").addClass('animated slideTopIn');
            $('[f="but_show_offtab"]').addClass('animated fadeIn');
        }
        else {
            $("#menuTab .content").addClass('animated slideTopOut');
            $('[f="but_show_offtab"]').addClass('animated fadeOut');
        }
    });
    $('[f="but_close_tab"]').on('click', function () {
        $("#menuTab .content").addClass('animated slideTopOut');
        $('[f="but_show_offtab"]').addClass('animated fadeOut');
    });
    $('[f="but_show_offtab"]').on('click', function () {
        $("#menuTab .content").addClass('animated slideTopOut');
        $('[f="but_show_offtab"]').addClass('animated fadeOut');
    });
    $("#menuTab .content").on('animationend', function () {
        if($(this).hasClass('slideTopOut')) {
            $("#menuTab").hide();
        }
        $(this).removeClass('animated slideTopIn slideTopOut');
        $('[f="but_show_offtab"]').removeClass('animated fadeIn fadeOut');
    });
});
</script>