I may be dumb, but can't find any info about it.
If I want to attach a JavaScript function to the event for a mouse up I do it this way:
<div id="div1" on-mouseup={{menuMouseUp}}></div>
What are the key words for touch events? Is it on-touch-start, on-touchstart.. ?
Or it's not supported and we need to use pointers:
http://www.polymer-project.org/platform/pointer-events.html
I'm trying to test it on Ipad and no luck at all.
Cheers!
Today, Polymer implements a set of high-level events that unify a few different underlying event models.
For example, when using Polymer, instead of click you can use tap. Instead of mouseup you can use up. The Polymer equivalents work for mouse or touch.
There is some detailed information here:
https://groups.google.com/forum/#!msg/polymer-dev/ba4aDyOozm8/Hw0GJLvcOCMJ
Related
I am building a Javascript based application with PHP and mysql in backend.
Because of complexity of code, I want to be able to trigger custom events and do operation whenever that even is captured.
So I came across this and this. According to this we can use jQuery triggers as well.
Great? Not Yet. In those documents it says that these custom events are not supported by IE.
However, I have used jQuery plugins before which uses custom events and works on IE.
My questions are
Are custom events supported by IE?
How can I find compatibility across browsers?
What is the correct way to use custom events?
Are there any jQuery Plugins which caters for custom events ?
Are there any NEGATIVE impacts of using custom events?
Question 1, 2 & 3 are the main concern to ask this question.
JQuery normalises it's own event structure over the top of the existing browser's implementation for cross-browser consistency.
Essentially you can trigger a custom event on an element and it will JQuery bubble up the event through the DOM tree, triggering the event on each element unless the event stop propagation is called. JQuery 1 supports IE 6 & above and JQuery 2 supports IE 9 & above.
http://api.jquery.com/category/events/event-object/
http://api.jquery.com/trigger/
http://jquery.com/browser-support/
Since I'm searching for an answer for a while now and I'm still without any clue, I'll just describe my actual problem:
I need to build up automated touch/mouse gestures (tap,drag,pinch...) which I can fire on a webpage in order to test touch frameworks and their performance. Thus I want to trigger "global" touch/mouse events on a webpage with JavaScript without dispatching them from a specific element.
Does anyone know how I could achieve this or how these events are delegated in general?
If you need this just for the sake of emulating mobile touch actions on your browser, Chrome already has a tool for that. Check out Mobile Emulation.
Does anyone have a link to a list of ALL events that can be passed to jQuery .on()?
Here are a few, but I cant seem to find a definitive list.
click
mouseenter
mouseleave
contextmenu (works on right click, and tap and hold with Android (not iOS))
focus
blur
focusin
focusout
scroll
I'm looking for Android/iOS touch events in particular.
Thanks!
EDIT 1: So I think the real question i'm asking is what events are standard across all browsers/devices?
I think you have to realise that the important question is not: What events can you pass to jQuery.on()? Because you can technically pass any event to that method.
The real question is, what events does the browser/device fire? Obviously, some events — as the ones you listed — are a standard, but some browsers will surprise you by not firing some events or by having their own custom events.
You can find a pretty extensive list at the MDN:
Events reference
But keep in mind that the point is that you can also define your own custom events, trigger them, and bind event listeners to them.
For touch screen devices you will have the following events:
touchstart
touchend
touchmove
touchcancel
Are you using jQuery mobile? The events are listed here: http://api.jquerymobile.com/category/events/
Google DOM Events, get MDN Event Reference.
You may be particularly interested in the TouchEvent subclass.
Of course, you can bind any custom event using .on and trigger any custom event with .trigger, so the real answer is infinite.
You can register any event names. Whether they will be called is another question… Custom events can be manually triggered, and there are many that are triggered natively in the DOM. For some of them, jQuery has special shorthand methods.
I'm looking for Android/iOS touch events in particular.
Have a look at https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Events/Touch_events then, or the W3 spec.
All jQuery events.
Here are lists of keyboard events and mouse events.
The official documentation only says:
The event's type, such as "click", "blur" or "keypress".
For iOS devices the touchstart is another event which is working. Where can I get the full list of all possible events? I like for example actually to get the event for the <select> event hasChanged(). Is this based on another library?
Meteor doesn't define the events it supports — it simply creates a cross-browser event listener wrapper. If you wanted to create custom events and trigger them, Meteor would pick them up.
The native input events supported depends on the browser: the Mozilla Developer Network reference is a good place to start.
Th docs also says that all the DOM events are also possible in addition to click, focus, blur, etc.
Other DOM events are available as well, but for the events above,
Meteor has taken some care to ensure that they work uniformly in all
browsers.
You can see the list of available Javascript events here and here.
I have not used Ember.js before, but after reading the part of the guide on views, I wanted to know how the Ember experts out there would handle a situation where multiple native events needed to be mapped to the same "application event".
In the guide, the example given shows mapping the (native) click event to the (application-specific) deleteItem event. In many cases, it is common for many native events to map to one application-specific event. What if a user was using a touch device that also had a keyboard and mouse attached (e.g. soon-to-come Windows 8 tablets), and I needed to map the "touchstart", "click" and "keyup" (e.g. [CTRL]-D) events to the same application-specific event like deleteItem?
Would you just put 3 methods on the view -- touchStart, click and KeyUp -- and have them all call a common 4th method to send the deleteItem event?
Is there anything built into Ember to handle this situation -- specifically, the situation where multiple native events all have the same semantic meaning in an app? I think this will become more and more common as browsers are touch enabled, laptops are touch-enabled and browser APIs can accept input from other hardware like mic, camera, etc... I could imagine a device where 5 or 6 native events all have the same semantic meaning for a given view.
Thanks!
We've been talking about something similar to support 'tap' events.
I think the best approach is to use register jQuery 'special events'. Here's a link to more information: http://benalman.com/news/2010/03/jquery-special-events/
To make a special event work with Ember views, you'll need to register it as a custom event on your Ember.Application instance:
Ember.Application.create({
customEvents: {
// key is the jquery event, value is the name used in views
myeventname: 'myEventName'
}
});