顶部幻灯片菜单问题

时间:2014-06-16 13:30:00

标签: javascript

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

由于我不熟悉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>

提前谢谢大家!

1 个答案:

答案 0 :(得分:0)

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

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