Useful Snippets for Mobile Web Development. Any comments or suggestions will be greatly appreciated.

mobileDev.js

/////////////////////////////////////////////////////////////////////////////////////////////////
// USERAGENT SNIFFING / MOBILE BROWSER DETECTION
/////////////////////////////////////////////////////////////////////////////////////////////////

if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
  $("html").addClass("iosmobile");
}

if(navigator.userAgent.match(/Android/i)){
  $("html").addClass("android");
}

if(navigator.userAgent.match(/IEMobile/i)){
  if(navigator.userAgent.match(/MSIE 10/i)){
    $("html").addClass("ie-10");
  }else{
    $("html").addClass("ie-crap");
  }
}

if(navigator.userAgent.match(/BlackBerry/i)){
  $("html").addClass("blackberry");
  if(navigator.userAgent.match(/WebKit/i)){
    if(navigator.userAgent.match(/BB10/i)){
      //Assuming BB OS 10 (Touchscreen)
      $("html").addClass("bb-os10");
    }else{
      //Assuming BB OS 6 - 7 & Tablet
      $("html").addClass("bb-os7");
    }
  }else{
      //Assuming this is BB OS 4.2 - 5.0
      $("html").addClass("bb-os5");
  }
}

/////////////////////////////////////////////////////////////////////////////////////////////////
// HANDLING TOUCHSTART & TAP EVENTS
/////////////////////////////////////////////////////////////////////////////////////////////////

var clickEventType=((document.ontouchstart!==null)?'click':'touchstart');

Element.unbind().bind(clickEventType, function(e) {
  DoSomething();
});

var tapEventType=((document.ontouchstart!==null)?'click':'tap');

$.event.special.tap = {
    setup: function(data, namespaces) {
        var $elem = $(this);
        $elem.bind('touchstart', $.event.special.tap.handler)
             .bind('touchmove', $.event.special.tap.handler)
             .bind('touchend', $.event.special.tap.handler);
    },
    teardown: function(namespaces) {
        var $elem = $(this);
        $elem.unbind('touchstart', $.event.special.tap.handler)
             .unbind('touchmove', $.event.special.tap.handler)
             .unbind('touchend', $.event.special.tap.handler);
    },
    handler: function(event) {
        event.preventDefault();
        var $elem = $(this);
        $elem.data(event.type, 1);
        if (event.type === 'touchend' && !$elem.data('touchmove')) {
            event.type = 'tap';
            $.event.handle.apply(this, arguments);
        } else if ($elem.data('touchend')) {
            $elem.removeData('touchstart touchmove touchend');
        }
    }
};

Element.unbind().bind(tapEventType, function(e) {
  DoSomething();
});

/////////////////////////////////////////////////////////////////////////////////////////////////
// HIDE SCREEN KEYBOARD WHEN USER PRESS ENTER INSIDE INPUT FIELDS
/////////////////////////////////////////////////////////////////////////////////////////////////

document.onkeyup=function(e) {
  if(e.which == 13){
    document.activeElement.blur();
  }
}

/////////////////////////////////////////////////////////////////////////////////////////////////
// ENTER/RETURN KEYPRESS DETECTION FUNCTION
/////////////////////////////////////////////////////////////////////////////////////////////////

$.fn.enterKey = function (fnc) {
    return this.each(function () {
        $(this).keypress(function (ev) {
            var keycode = (ev.keyCode ? ev.keyCode : ev.which);
            if (keycode == '13') {
                fnc.call(this, ev);
            };
        });
    });
};

/////////////////////////////////////////////////////////////////////////////////////////////////
// HIDING URL BAR IN BROWSER 
/////////////////////////////////////////////////////////////////////////////////////////////////

setTimeout(function(){
  window.scrollTo(0, 0);
  if(navigator.userAgent.match(/Android/i)){
    window.scrollTo(0,1);
  }
}, 100);

/////////////////////////////////////////////////////////////////////////////////////////////////
// CONFIRM POPUP WHEN LEAVING PAGE 
/////////////////////////////////////////////////////////////////////////////////////////////////

function ConfirmLeave(){
  if ($("html").hasClass("android")){
    window.onbeforeunload = function(){
      return 'Are you sure you want to leave?';
    };
  }
}