ftlabs / fastclick

Polyfill to remove click delays on browsers with touch UIs
MIT License
18.65k stars 3.22k forks source link

Windows Phone 8 browser is Not Supported? #97

Closed mrchief closed 10 years ago

mrchief commented 11 years ago

The basic usage page on WP8 stock browser acts the same as it does on a desktop browser. Apparently, you're looking only for iOS and Android browsers, while ignoring any other OS.

Is this not an issue on Windows Phone 8 or do you plan to add support later?

Laumania commented 11 years ago

Im listening in on this one too. Support for Windows Phone 7 and 8 would be appreciated :+1:

mattcg commented 11 years ago

Sorry about the delay - getting the Windows Phone Emulator set up is a massive pain. I need to buy a copy of Windows 8 Professional x64, find or buy a computer with a SLAT processor, install Windows 8 then install the SDK. I'm finally getting around to doing all of this.

In the meantime, can anyone tell me if there is even a click delay in IE on Windows Phone?

mattcg commented 11 years ago

Couldn't find a spare computer with SLAT processor, so I'm using a guide for VMWare Fusion instead.

Laumania commented 11 years ago

"In the meantime, can anyone tell me if there is even a click delay in IE on Windows Phone?"

Well, the delay is there, if there is a way to get around it I dunno. Somethings telling me that it's not possible on WP7 due to missing events, but these should be there in WP8. Sorry, don't have links or anything, just what I heard.

mattcg commented 11 years ago

Have you tried adding -ms-touch-action: none as described here?

rafayepes commented 10 years ago

The delay exist. Using -ms-touch-action: none "solves" the delay issue. However, it creates other issues.

I was using -ms-touch-action: none on WP8 until realised some functionalities weren't working. Removed the -ms-touch-action: none and they worked, but with the delay.

rafayepes commented 10 years ago

Setting -ms-touch-action: none just to the body tag ended up working well for me.

matthew-andrews commented 10 years ago

That's great to hear @rafayepes. Do you think the instructions on how to implement -ms-touch-action: none; written on our README.md need to be updated?

rafayepes commented 10 years ago

@matthew-andrews It'll be great to know if someone else had issues setting -ms-touch-action: none; to other elements than the body. It worked for me.

In the link provided in the README.me to the MSDN blog post, is said to set the -ms-touch-action: none; to the body tag. I wonder why the FastClick documentation says to set it to the a, input and button tags. I guess it's probably said in order to be more specific, but maybe anyone had some issues before by setting it to the body tag.

matthew-andrews commented 10 years ago

I've removed the example from the readme - but kept the link. I think we also put -ms-touch-action: none on the body tag for the Windows 8 app we built for The Economist but feels safer just to link to MSDN :-)

sbaechler commented 10 years ago

Using -ms-touch-action: none on a scrollable div disables scrolling on WP8. So I just use -ms-touch-action: none on the buttons directly.

jpescada commented 10 years ago

The if condition below from FastClick.notNeeded breaks on iOS 8

// IE10 with -ms-touch-action: none, which disables double-tap-to-zoom (issue #97)
if (layer.style.msTouchAction === 'none') {
    return true;
}

Throws the following: TypeError: undefined is not an object (evaluating 'layer.style')

rowanbeentje commented 10 years ago

@jpescada layer.style is the "style" property on the element you passed into the constructor/.attach(). Could you verify you're passing in a valid DOM node?

jpescada commented 10 years ago

Sorry. Please ignore that.

It was AngularJS related. Apparently $document.body is not the same as document.body.

rowanbeentje commented 10 years ago

Thanks for the update :)

brunolemos commented 10 years ago

This solved for me:

html {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

I suggest the author to add this to the package. Tested on Windows Phone 8.1

sbaechler commented 10 years ago

touch-action: manipulation is actually better suited than touch-action: none. It still reacts to everything except for double-tap. While none prevents any touch action. Still, adding the rule to the root element might be overkill. It should definitely be added to the documentation.

matthew-andrews commented 10 years ago

@sbaechler Looks like you're right!

screen shot 2014-11-19 at 14 36 05 http://blogs.telerik.com/appbuilder/posts/13-11-21/what-exactly-is.....-the-300ms-click-delay

I'll get that updated.

matthew-andrews commented 10 years ago

@sbaechler does this work for you ? https://github.com/ftlabs/fastclick/pull/331