捏缩放问题Phonegap构建停止工作

Question

I have a working pinchzoom in html using iscroll but when i build it for phonegap for ios and android it pinch zoom seems to stop to work. 我使用iscroll在html中有一个可工作的pinchzoom，但是当我为ios和android的phonegap构建它时，它的捏缩放似乎停止工作。

The code below is my working code on html but when i try to port it to an ios and android app it stops working. 下面的代码是我在html上的工作代码，但是当我尝试将其移植到ios和android应用程序时，它将停止工作。 Viewing it in a browser works. 在浏览器中查看它的作品。

I am not really good with javascript maybe somebody can help me fix this issue. 我对javascript不太满意，也许有人可以帮助我解决此问题。

Here is my code. 这是我的代码。

<!DOCTYPE html>

<title>My Page</title> 

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

<!-- Styles -->
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.3.1.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,300' rel='stylesheet' type='text/css'>
<link href="css/jquery.mobile.iscrollview.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/jquery.mobile.iscrollview-pull.css" media="screen" rel="stylesheet" type="text/css" />

<!-- Scripys -->
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script>
<script src="js/jquery.mobile.iscrollview.js" type="text/javascript"></script>
<script src="js/iscroll.js" type="text/javascript"></script>
<script src="js/jquery.mobile.iscrollview.js" type="text/javascript"></script>
<script src="phonegap.js" type="text/javascript"></script>
<script type="text/javascript">
  var myScroll;
  function loaded() {
    myScroll = new iScroll('wrapper',{
      zoom:true, zoomMax: 4 
    });
  }
  document.addEventListener('DOMContentLoaded', loaded, false);
</script>

<!-- Start of Page - Map-->
<div id="map" data-role="page">

  <div data-role="header" data-position="fixed" data-tap-toggle="false">
    <div id="logo">
      <img src="images/logo-dark.png">
    </div>
  </div>

  <!-- Start of Content - Schedule [Map] -->
  <div data-role="content">

    <div id="wrapper" style="width:100%">
      <img class="mapimage" src="images/leaf_map.jpg"/>
    </div>

  </div>
  <!-- End of Content -->

  <!-- Start of Footer -->
  <div data-role="footer" data-position="fixed" data-role="footer" data-tap-toggle="false">

    <div class="banner">
      <div>
        <a href="promo.html" data-rel="dialog" data-transition="pop">
          <span>This app was created by:</span> 
          <span><img src="images/iwebxpert-logo.png"></span>
          <span>iWebXpert</span>
        </a>
      </div>
    </div>

    <!-- Navbar / Main Navigation -->
    <div data-role="navbar">
      <ul>
        <li>
          <a href="index.html" data-ajax="true" data-transition="slide" data-direction="reverse"><img src="images/home-icon.png"></a>
        </li>
        <li>
          <a href="schedule.html" data-ajax="true" data-transition="slide" data-direction="reverse"><img src="images/schedule-icon.png"></a>
        </li>
        <li>
          <a href="#" data-ajax="true" data-transition="slide" class="ui-btn-active"><img src="images/map-icon.png"></a>
        </li>
        <li>
          <a href="design.html" data-ajax="true" data-transition="slide"><img src="images/design-icon.png"></a>
        </li>
        <li>
          <a href="info.html" data-ajax="true" data-transition="slide"><img src="images/about-icon.png"></a>
        </li>
      </ul>
    </div>


  </div>
  <!-- End of Footer -->

</div>
<!-- End of Page - Map-->

<script>loaded();</script>

Answer 1

Since you are loading scripts from external sources (if you haven't already) make sure you add 由于您是从外部来源加载脚本（如果尚未加载），请确保添加

 <access origin="*" />

to your config.xml file 到您的config.xml文件

捏缩放问题Phonegap构建停止工作

问题描述

1 个解决方案

解决方案1
0 2013-09-13 15:36:17

捏缩放问题Phonegap构建停止工作

问题描述

1 个解决方案

解决方案1 0 2013-09-13 15:36:17

解决方案1
0 2013-09-13 15:36:17