Wednesday, 24 June 2015

Prevent browser from loading drag and dropped file

I've been implementing a drag-and-drop uploader today but found that if the user missed the drop area the browser would load the file directly. Annoying huh? I overcame this with this nifty bit of javascript:
window.addEventListener("dragover",function(e){
  e = e || event;
  e.preventDefault();
},false);
window.addEventListener("drop",function(e){
  e = e || event;
  e.preventDefault();
},false);

Tuesday, 9 June 2015

Untappable areas with Android 4.x and Phonegap

I came across a problem today while using jQuery to hide one div and show another in its place. The touchable elements on the revealed (buttons, input fields) weren't responding to touch. I found on SO that adding the following style to the problem div fixes the problem:
.androidpaintfix {
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0, 0, 0);
}
If you're doing this to a div that needs to be hidden then you need to do it dynamically in JS like so:
$("#formLogin").addClass('androidpaintfix');