jquery mobile - 单击页面后,页脚中的可折叠页面会向下展开

时间:2013-07-12 22:32:55

标签: jquery html jquery-mobile footer jquery-mobile-collapsible

嘿伙计们我正在学习jquery mobile并创建了一个带有页眉和页脚的非常基本的页面。基本上我希望页脚可以折叠到总是向上扩展但我在实现这个问题上遇到了问题。

如果我加载页面并通过单击按钮打开可折叠,它会向上扩展(预期的行为)。 但是,如果我单击页面上的任何位置,然后单击页脚,它会向下扩展。即使我使用data-position="fixed"将此标记添加到可折叠本身也不会改变行为,似乎点击页面会分离页脚。

再次点击页面会重新连接它并向上打开。

我总是可以通过使用css强制它。但我想知道是否有更好的解决方法。

我不能提供一个jsfiddle因为问题只发生在浏览器中(我在droid razr上测试过chrome,firefox和android浏览器)。这是我的代码:

<html>
<head>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
</head>

<body>
    <div data-role="Page">
        <div data-role="header">
            <h1>Header</h1>
        </div>
        <div data-role="footer" data-position="fixed">
            <div data-role="collapsible" data-content-theme="b">
                <h3>Footer</h3>
                <p>Footer content</p>
            </div>
        </div>
    </div>

</body>


<html>

1 个答案:

答案 0 :(得分:0)

今天在做类似的事情。我偶然发现了同样的问题并通过添加

来修复它
data-tap-toggle="false"

到div。