从右向左滑动垂直菜单 > Jquery

Question

大家好，我想让我的垂直菜单从右向左滑动。但据我所知 jquery 是 .toggle() （这是从上到下滑动）我希望单击汉堡菜单时菜单从右向左滑动。如果有任何人可以帮助我，我真的很想

我没有尝试使用 jquery 从右向左滑动的任何代码，我只尝试过 .toggle

.ham-menu{
    width: 35px;
    display: block;
    z-index: 2;
    position: relative;
    top: 10px;
    right: 15px;
    cursor: pointer;
}

.ham-menu .line{
    background: green;
    width: 100%;
    display: block;
    margin-top: 3px;
    height: 4px;
    border-radius: 2px;
}
.first-section{
    padding: 0;
}
.first-section .slide-menu{
    width: 20vw;
    height: 100vh;
    background-color: #000;
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.list-menu{
    list-style: none;
    text-align: center;
    font-size: 30px;
}
.list-menu li{
    margin: 20px;
}
.list-menu a{
    text-decoration: none;
    color: #fff;
}

<div class="ham-menu">
        <span class="line"></span>
        <span class="line"></span>
        <span class="line"></span>
</div>

<div class="first-section container-fluid">
        <div class="slide-menu">
            <ul class="list-menu animated">
                <li><a href="#">Home</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Contact</a></li>
                <li><a href="#">Footer</a></li>
            </ul>
        </div>
    </div>

Answer 1

这是您要找的吗？

CodePen link

.first-section{
  display: none;
  padding: 0;
}

JQUERY:

$('.ham-menu').click(function(){
  $('.first-section').toggle();
})

从右向左滑动垂直菜单 > Jquery

Sliding from right to left vertical Menu > Jquery

html

javascript

css

jquery

hamburger-menu