切换侧栏时,语义UI菜单消失

时间:2018-07-31 06:40:15

标签: semantic-ui sidebar

看看这支笔: https://codepen.io/anon/pen/gjvOvL

为什么在切换侧栏时菜单项消失了? 有没有办法让它们可见?

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Myworkbanch</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link href="https://cdn.jsdelivr.net/npm/semantic-ui@2.3.3/dist/semantic.min.css" rel="stylesheet">
  <style type="text/css">

  </style>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.3.3/dist/semantic.min.js"></script>
<script>
  $(document)
    .ready(function() {

        $('.toc.item').click(function() { 
            $('.ui.sidebar').sidebar('toggle');
        });
    });
  </script>
</head>
<body class="pushable">

    <!-- menu -->
    <div class="ui inverted secondary pointing  menu">
        <a class="toc item">
                <i class="sidebar icon"></i>
        </a>
        <a class="active item">Editorials</a>
        <a class="item">Reviews</a>
        <a class="item">Upcoming Events</a>
        <a class="item">Past Events</a>  

        <div class="right item">
            <div class="ui button">Sign-up</div>
        </div>
    </div>


    <!-- sidebar -->
    <div class="ui sidebar inverted vertical menu">
            <a class="active item">Editorials</a>
            <a class="item">Upcoming Events</a>
            <a class="item">Past Events</a>
            <a class="item">Sign-up</a>  
    </div>

    <div>ciao ciao</div>

</body>
</html>

添加随机文本仅是为了使这些帖子能够从stackoverflow接受。 添加随机文本仅用于使该帖子从stackoverflow接受。 添加随机文本仅用于使该帖子从stackoverflow接受。 添加随机文本仅是为了使这些帖子能够从stackoverflow接受。

0 个答案:

没有答案