Enabling pinch zoom on iOS when using iScroll.js

I'm building a one page scrollable web application using iScroll.js and I can't get its built in zoom feature to work no matter what I do. I'm including the iscroll-zoom.js file yet still haven't had any success.

I've got this in the head of my file:

<script src="js/iscroll.js"></script>
<script src="js/iscroll-zoom.js"></script>
<script src="js/iscroll-probe.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">

And this script:

function loaded () {
myScroll = new IScroll('#wrapper', { 
    mouseWheel: true,
    zoom: true,
    bounce: false 
});

According to the iScroll Documentation this should work, but it doesn't. If it helps, I need to get this running on an iPad.

Answers


function createZoomForID (id) {
    $timeout(function(){
        var wrapper = document.getElementById(id);
        var myScroll = new IScrollZ(wrapper, {
            zoom: true,
            zoomMin: 1,
            zoomMax: 4,
            scrollX: true,
            scrollY: true,
            mouseWheel: true,
            freeScroll: true,
            wheelAction: 'zoom',
        });
        $scope[id] = myScroll;
    }, 125);
}

Need Your Help

Textarea 100% height in IE

css textarea height

How do I get my &lt;textarea&gt; to have a height of 100% and work in IE7/6? height:100% works fine in all other browsers but IE just doesn't want to accept anything other than specific values.

Changing a deprecated code piece in Unity (BoxCollider2D)

unity3d 2d deprecated obsolete

I am trying to use the box collider functionality in Unity, however it seems to be deprecated.