Question

我知道有点奇怪的请求。

我有一个jQueryMobile页面，你可以看到一个简单的页面：

    <div data-role="page" class="type-home"  id="home">
        <div data-role="header" data-theme="b">
            <h1>Our Tools</h1>
        </div>
        <div data-role="content">
            <ul data-role="listview">
        ......

我需要在最顶层放置一个包含100 px高内容的Div，不包括jQuery Mobile使用的任何样式或div。

如何做到这一点，因为添加一个简单的Div就像jQuery Mobile一样。

我不能使用iFrame，它必须全部在html的一页上。

Answer 1

如果你想要一个静态的头型DIV，这对我有用。我把一个固定高度的“标题”，然后用下面的边距顶部偏移“内容”。 .ui-content是由jQM自动添加的类。

HTML：

<div data-role="page" id="somePage">
        <div class="ui-bar ui-bar-b">
            <a data-role="button" href="#main" data-transition="none" data-theme="a"></a>
            <h1>Some header</h1>

        </div>
        <div data-role="content">
            <div id="someDiv">
                </div>
        </div>
    </div>

CSS：

.ui-bar {
    position: fixed;
    height: 100px;
    z-index: 10000;
    width: 100%;
    padding: 0px 5px;
    box-sizing: border-box;
}

.ui-content {
    position: relative;
    padding: 10px;
    margin-top: 100px;
}

jQuery Mobile Div在顶部

1 个答案: