顶部幻灯片菜单问题

Question

我使用Codrops教程重新创建此菜单。现在，我希望它从顶部滑动（就像它一样），但问题是在这种情况下它覆盖了我的菜单＆＃39;按钮所以我不能将它滑回并隐藏它。

由于我不熟悉JavaScript，我想问某人如何做到这一点？我相信在HTML代码的底部脚本中只需要更改一行或两行代码。

任何人都可以帮我解决这个问题吗？我正在寻找的是，当用户点击菜单下方的空白区域时，菜单会显示回来。那太棒了！

这是我的JSFiddle：http://jsfiddle.net/Yqszh/

<script>
        var menuTop = document.getElementById( 'cbp-spmenu-s3' ),
            showTop = document.getElementById( 'showTop' ),
            body = document.body;

        showTop.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( menuTop, 'cbp-spmenu-open' );
            disableOther( 'showTop' );
        };

        function disableOther( button ) {
            if( button !== 'showTop' ) {
                classie.toggle( showTop, 'disabled' );
            }
        }
    </script>

提前谢谢大家！

Answer 1

我更新了您的JSFIDDLE，您可以添加这样的关闭按钮，您可以根据自己的要求设置样式。

JSFIDDLE链接：http://jsfiddle.net/Yqszh/1/