如何在使用iscroll时在jquery mobile中向下滚动页面?

时间:2013-04-28 12:35:55

标签: jquery-mobile

使用iscroll进行listview的刷新功能。它将禁用jquery mobile的其他页面上的页面滚动。

<script type="text/javascript" src="/js/iscroll.js"></script>

基mobile.html

<title>Title</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="description" content="xxx">
        <meta name="keywords" content="yyyy">
        <link rel="stylesheet" type="text/css" href="/css/jquery.mobile-1.3.1.css" />
        <link rel="stylesheet" type="text/css" href="/css/mobile.css" />
        <script src="/js/jquery-1.9.0.min.js"></script>
        <script src="/js/jquery.mobile-1.3.1.min.js"></script>
        <script type="text/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="/js/iscroll.js"></script>

item.html

{% extends "base-mobile.html" %}

{% block content %}
<div id="item" data-role="page">
    <div data-role="header">
        <h1 class="ui-title" role="heading" aria-level="1">Item</h1>
        <a href="#all-items" data-inline="true" class="ui-btn-left" data-icon="arrow-l">Back</a>
    </div>
    <div data-role="content" class="ui-content" role="main">

        <h2>title</h2>

        <div id="category">
            <label>Category: category </label> 

        </div>

        <p>location</p>


        <p>description</p>
        <div id="map_canvas">
        <img src="http://maps.googleapis.com/maps/api/staticmap?center=location&zoom=16&size=300x200&markers=xxx,xxx&sensor=false" ></div>
    </div>
    <div data-role="footer" data-position="fixed"> 

    </div>
    </div>
</div>
{% endblock %}

只需构建一个比iphone屏幕尺寸更大的页面。我无法向下滚动到我的模拟器或iPhone上的页面。任何人都可以指点我的方向或让我知道该怎么做,拜托?

提前致谢。

1 个答案:

答案 0 :(得分:2)

我假设你有HTML,BODY和HEAD标签。你在使用“视口”设置吗?在HEAD中我使用:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">

我可以在横向位置滚动您在iPhone上面张贴的页面。在纵向位置,页面不需要滚动。你能详细说明一下吗?

动态注入内容后,您使用的是.page()和/或.changePage()吗?

$('pageSelector').page();

此链接对我来说是一个很好的参考:http://jquerymobile.com/demos/1.2.0/docs/pages/page-dynamic.html