ajax 不传session

JQuery是一种非常流行的JavaScript库，可以方便地创建交互式的Web页面。其中一个最常用的功能之一是导航菜单，特别是在移动设备上。在本文中，我们将探讨使用JQuery如何简单地创建移动设备上的导航菜单。

首先，为了创建移动设备友好的导航菜单，我们需要一个响应式的布局。使用CSS media查询可以实现这一点，我们可以在不同的屏幕尺寸下应用不同的样式。

@media only screen and (max-width: 600px) {
    /* 在屏幕宽度小于600px时应用的样式 */
    /* 在这里添加你的CSS样式 */
}

接下来，我们需要一个菜单图标，当用户点击它时，导航菜单会展示。我们可以使用FontAwesome等字体图标库，或者自己创建菜单图标。

<i class="fa fa-bars"></i>

现在我们需要编写JQuery来实现点击菜单图标时显示菜单。我们可以通过添加和删除CSS类来控制导航菜单的显示和隐藏。

$(document).ready(function() {
    $('.menu-icon').click(function() {
        $('nav').toggleClass('show');
    });
});

最后，我们可以添加一些CSS动画效果来使导航菜单更吸引人。

nav {
    /* 添加一些基本的样式 */
    transform: translate3d(-100%,0);
    transition: transform 0.5s ease;
}

nav.show {
    transform: translate3d(0,0);
}

现在，我们已经成功地创建了一个响应式移动导航菜单。使用JQuery和CSS，我们可以很容易地实现这些效果，让我们的网站更加丰富多彩。