Question

我正在创建一个小型移动原型。我可以将我的内容推向显示/隐藏。这是我的代码请帮忙！我不确定问题出在哪里。我认为它可能会放置一个位置：相对或其他属性。我希望尽快修复此问题。如果你能指出我如何解决这个问题的正确方向，我将非常感激。我认为我的div正确堆叠但我不确定。我编码后已经有一段时间了，我有点生疏了。

    <body>
    <div id="header">
        <a href="#" onclick="overlayvis(showhideme)"><img src="images/header.gif"></a>
    </div>

    <div class="nav" id="showhideme" style="visibility: hidden; display: block; position relative;">
        <div id="content">
               <p><img src="images/nav.png"></p>
        </div>
    </div>

    <div class="wrap">
        <div id="content">
            <p>
                <img src="images/body.jpg" border="0" usemap="#Map">
                <map name="Map" id="Map">
                    <area shape="rect" coords="3,1727,638,1804" href="#top" alt="back to top" />
                    <area shape="rect" coords="31,1853,611,1940" href="tel:+18005555555" alt="tap to call" />               
                </map>
            </p>
        </div>

        <div id="footer">
            <a href="#content"><img src="images/footer.png"></a>
        </div>
    </div>
</body>
</html>

非常感谢！

Answer 1

删除内嵌样式并将class="somebutton"添加到您的链接。然后使用以下jQuery。

$('a.somebutton').on('click', function(){
    $('#showhideme').animate({height:'toggle'});
});

Answer 2

我希望，您正在寻找JQuery Mobile手风琴，请查看链接，它可能对您有帮助，

http://jquerymobile.com/demos/1.3.0-rc.1/docs/demos/widgets/accordions/

onclick显示/隐藏推送内容

2 个答案: