html - ipod 和 xcode 模拟器之间的 HTML 元素位置不一致?

标签 html css scroll mobile-application

这是我的代码。底部的按钮上有一个 jQuery 函数,它使列表向上滑动进入 View (这里的列表是空白的,它是由 javascript 填充的。正如您所看到的,这里只是空行。)

列表从按钮的正上方滑入 View ,并在它到达顶部的 Home div 时停止。然后我可以滚动列表,同时按钮和主页 div 固定在屏幕的顶部和底部。无论如何,在模拟器上。在 iPod 上,当列表弹出到 View 中时,当我向下滚动时,主页 div 和按钮会与其他所有内容一起向上移动,就好像它们是列表中的元素一样!什么鬼?

这是一款使用 PhoneGap 制作的移动应用。

 <body>

        <div style="position:fixed; width:100%; border-bottom: 3px solid; z-index: 19; background:#FFFFFF; padding:5px;"> 
            <a style="text-decoration:none; z-index:20;" href="index.html">Home</a>
        </div>
        <br />

        <div id="map_canvas" style="width:100%; margin-top:10px; height:400px;"></div>

        <div style="position:relative">

            <div id="resultsList" style="background: #FFFFFF; width:100%; margin-top:15px; height: 400px; z-index:1; position:absolute; bottom:0; left:0; display:none">

                <br id="top"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/>
                <hr class="filler"/>
                <br class="filler"/> 

            </div>

        </div>

        <div style="position:fixed; width:100%; border-top: 3px solid; z-index: 19; background:#FFFFFF; padding:5px;"> 
            <button id="bottombar" type="button" style="z-index:20; padding-bottom:5px;">Show as List</button>
        </div>

        <!--Maps API Key
         AIzaSyD52tRfTY1FtEgXQpvu9-jN5AOz-2pxQg0
         -->

    </body>

最佳答案

这就是一些智能手机处理位置的方式:固定的,它们会在您滚动时移动然后快速返回。

Sencha TouchjQuery Mobile可能会帮助您以一种不会发疯的方式实现您的风格

关于html - ipod 和 xcode 模拟器之间的 HTML 元素位置不一致?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10379643/

相关文章:

html - Woocommerce 按钮未与中心对齐

javascript - 使用 JavaScript 将多个输入值复制到剪贴板

php - 如何在固定容器中添加滚动条

javascript - 内联 JavaScript 似乎是随机加载的,如果有的话

jquery - 从另一个页面链接到固定标题下的 anchor

html - 如何制作具有部分透明边框的任意大小的 html 元素?

html - 如何加载多个惰性CSS加载文件

CSS3 :not negation pseudo-class not fully supported by Firefox?

html - overflow hidden 但没有滚动条的可滚动区域

javascript - 滚动时如何锁定表格的第一行和第一列,可能使用 JavaScript 和 CSS?