Question

我网站的移动网站（http://www.codesrce.com/thedrumcenter）有一个非常现代且功能正常的推送菜单。但是，我希望让它更加用户友好。有人可以帮我调整我的代码，以便当用户按下菜单按钮时菜单将打开，当用户向右滑动屏幕打开它时，然后一旦打开它然后它们向左滑动到关闭它？此外，当按下按钮时，我希望它转到这种颜色＃0099FF，然后当它关闭时变回灰色。对不起，如果我的措辞不是最好的，但我希望你知道我的意思。 :)到目前为止，我将提供我的代码：

HTML

<div id="Mobile">

        <div id="menu">

        <ul>

            <li><a href="#">Top Brands</a></li>

            <li><a href="#">Drums</a></li>

            <li><a href="#">Hardware</a></li>

            <li><a href="#">Cymbals</a></li>

            <li><a href="#">Sticks</a></li>

            <li><a href="#">Drum Heads</a></li>

            <li><a href="#">Terms of Use</a></li>

            <li><a href="#">Affiliations</a></li>

        </ul>

    </div>

    <div id="right">

            <div id="Top">

            <div id="menubar">

                        <a id="menubarheader">DrumCenter</a>

                <a href="#menu" id="button" class="buttonicon"></a>

                <a href="#" id="searchlink" class="searchlink"></a>

            </div>

        </div>

    </div>

    </div>

JQuery的

$('#button').toggle( 
        function() {
            $('#right').animate({ left: 275}, 'fast', function() {
                $('#button');
            });
        }, 
        function() {
            $('#right').animate({ left: 0 }, 'fast', function() {
                $('#button');
            });
        }
    );

任何帮助都会受到赞赏，因为我是Javascript和JQuery的完整NOOB。谢谢！

Answer 1

基本上有不同的方法可以解决这个问题..我在你的网站上检查了CSS，看看你是怎么做的，但我已经放弃了8个CSS ......在浏览器中看得太多了

所以..基本上这个问题我相信被问到了 Swipe in the middle to open panel with jQuery Mobile? 他给了一个小提琴http://fiddle.jshell.net/Palestinian/2B4Ht/

所以我会以某种方式将其实现到您的编码中。有一个顶部固定的导航栏，折叠时会显示你的＆＃34;推送菜单＆＃34;。如果屏幕宽度小于768像素，或者你可以向左或向右滑动以打开将成为菜单本身的面板，那么只需选项。

只是我的建议。我从来没有像你问的那样做过菜单，但我认为这很难。

如何让我的推送菜单更加用户友好？

1 个答案: