Jquery 面板滑块在我从右到左更改其 CSS 后不会关闭

Question

跟进此问题。

我已经修复了jquery。现在我想从左边而不是右边使用它。所以我把它的类从"右边的cd面板"改为"左边的cd面板。它在打开时工作良好，但该按钮在打开后被禁用，无法关闭。

我试着调整CSS中的内容，比如将"left"改为"right"，反之亦然，但没有成功。在JSfiddle CSS上，除了按钮的位置外，什么都没有改变。

HTML:

<div class="cd-panel from-left">
    <div class="cd-panel-container">
    <button href="#0" class="cd-btn btn-primary">Views</button>
    <div class="cd-panel-content" ng-controller="ViewtreeCtrl">
    </div>
    <!-- cd-panel-content -->
</div>
<!-- cd-panel-container -->

Javascript：

jQuery(document).ready(function($){
    //open the lateral panel
    $('.cd-btn').on('click', function(event){
        event.preventDefault();
        $('.cd-panel').toggleClass('is-visible');
    });
});

JsFiddle演示（您可以在JsFiddle上看到CSS）

Answer 1

按钮没有被禁用，但它显示在.cd-panel-content分区下

要解决此问题，可以将z-index:1添加到.cd-btn类中。

另一种解决方案可能是将pointer-events:none添加到.cd-panel-content，但在这种情况下，.cd-panel-content上的链接将不起作用，所以我将使用z-index解决方案。