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



嗨,我希望我的垂直菜单从右到左滑动。但是据我所知我想要单击汉堡菜单时,菜单从右到左将滑动。如果Any1可以帮助我,我真的会APREREACIATE

我没有尝试使用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>

这是您要寻找的吗?

codepen链接

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

jQuery:

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

最新更新