Edit in JSFiddle

$(document).ready(function() {

    var log = $("#log");
    var scaleMe = $("#scaleMe");

    var pos1 = {};
    var pos2 = {};
    scaleMe[0].ongesturestart = function(e) {

        pos1 = {
            x: e.pageX,
            y: e.pageY
        };
        log.html("");
    }
    //Below method is used to find the direction in which drag happens.
    getDirectionFromAngle = function(angle) {
        var directions = {
            down: angle >= 45 && angle < 135,
            //90
            left: angle >= 135 || angle <= -135,
            //180
            up: angle < -45 && angle > -135,
            //270
            right: angle >= -45 && angle <= 45 //0
        };

        var direction, key;
        for (key in directions) {
            if (directions[key]) {
                direction = key;
                break;
            }
        }
        return direction;
    };
    scaleMe[0].ongesturechange = function(e) {
        e.preventDefault();
        pos2 = {
            x: e.pageX,
            y: e.pageY
        };
        var tr = Math.atan2(pos2.y - pos1.y, pos2.x - pos1.x) * 180 / Math.PI;

        var dir = getDirectionFromAngle(tr);
        log.append(dir + "</br>");


    }
    scaleMe[0].ongestureend = function(e) {
        log.empty();
    }
    scaleMe.bind("touchend", function(e) {
        log.empty();
    });
});
Pinch in the yellow region
<div id="log">To display the direction</div>
<!--  <button id="clickMe">clickMe</button>-->
<div id="scaleMe"></div><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><p><font size="3"><b>Source for this<a  target="_blank"href="http://jqfaq.com/how-to-find-the-direction-in-pinching/"</a> JQFaq Question</b></font></p>
<iframe id="iframe1" src="http://jqfaq.com/AdPage.html" style="width:100%;border:none;" />
#scaleMe
{
    background-color: #E9F115;
    border: 2px solid gray;
    height: 400Px;
    width: 400px;
    top: 52px;
    position: absolute;
    left: 300px;
}
#log
{
    width: 100px;
    border: 2px solid darkOrange;
    font-size:x-small;
}