Skip to content

[mediaqueries-4] make explicit that pointer, hover, any-pointer, any-hover relate only to pointing devices #973

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Mar 17, 2017
Merged

[mediaqueries-4] make explicit that pointer, hover, any-pointer, any-hover relate only to pointing devices #973

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
bd0d906
Change "input mechanism" to "pointing device"
patrickhlauke Jan 23, 2017
c10bef8
Add prominent note, and additional note, about being pointer-device-s…
patrickhlauke Jan 23, 2017
f350190
Cover edge-case: primary input not pointer, secondary pointer
patrickhlauke Mar 17, 2017
11a6689
Minor fix: change "User Agent" to "user agent"
patrickhlauke Mar 17, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
75 changes: 45 additions & 30 deletions mediaqueries/Overview.bs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1597,18 +1597,27 @@ Interaction Media Features</h2>
</style>
</div>

The 'pointer' and 'hover' features relate to the characteristics of the “primary” input mechanism,
while 'any-pointer' and 'any-hover' can be used to query the properties of all potentially available input mechanisms.
The 'pointer' and 'hover' features relate to the characteristics of the “primary” pointing device,
while 'any-pointer' and 'any-hover' can be used to query the properties of all potentially available pointing devices.

Note: While this specification does not define how User Agents should decide what the “primary” input is,
the expectation is that User Agents should make this determination
Note: While this specification does not define how user agents should decide what the “primary” pointing device is,
the expectation is that user agents should make this determination
by combining knowledge about the device/environment they are running on,
the number and type of input mechanisms available,
and a notion of which of these inputs is generally and/or currently being used.
User Agents may also decide to dynamically change what type of input is deemed to be primary,
the number and type of pointing devices available,
and a notion of which of these is generally and/or currently being used.
In situations where the primary input mechanism for a device is not a pointing device,
but there is a secondary – and less frequently used – input that is a pointing devices,
the user agent may decide to treat the non-pointing device as the primary (resulting in 'pointer: none').
user agents may also decide to dynamically change what type of pointing device is deemed to be primary,
in response to changes in the user environment
or in the way the user is interacting with the UA.

Note: The 'pointer', 'hover', 'any-pointer' and 'any-hover' features only relate to the characteristics,
or the complete absence, of pointing devices,
and can not be used to detect the presence of non-pointing device input mechanisms such as keyboards.
Authors should take into account the potential presence of non-pointing device inputs,
regardless of which values are matched when querying these features.

<h3 id="pointer">
Pointing Device Quality: the 'pointer' feature</h3>

Expand All @@ -1620,10 +1629,10 @@ Pointing Device Quality: the 'pointer' feature</h3>
</pre>

The 'pointer' media feature is used to query the presence and accuracy of a pointing device such as a mouse.
If a device has multiple input mechanisms,
the 'pointer' media feature must reflect the characteristics of the “primary” input mechanism,
If multiple pointing devices are present,
the 'pointer' media feature must reflect the characteristics of the “primary” pointing device,
as determined by the user agent.
(To query the capabilities of <em>any</em> available input mechanism,
(To query the capabilities of <em>any</em> available pointing devices,
see the 'any-pointer' media feature.)

<dl dfn-type=value dfn-for="@media/pointer">
Expand Down Expand Up @@ -1658,14 +1667,14 @@ Pointing Device Quality: the 'pointer' feature</h3>
even on devices whose pointing device can be described as ''fine'',
the UA may give a value of ''coarse'' or ''pointer/none'' to this media query,
to indicate that the user has difficulties manipulating the pointing device accurately or at all.
In addition, even if the primary input mechanism has ''fine'' pointing accuracy,
there may be additional ''coarse'' input mechanisms available to the user. Authors may
In addition, even if the primary pointing device has ''fine'' pointing accuracy,
there may be additional ''coarse'' pointing devices available to the user. Authors may
wish to query the 'any-pointer' media feature to take these other ''coarse'' potential
input mechanisms into account.
pointing devicess into account.

<div class="example">
<pre>
/* Make radio buttons and check boxes larger if we have an inaccurate pointing device */
/* Make radio buttons and check boxes larger if we have an inaccurate primary pointing device */
@media (pointer:coarse) {
input[type="checkbox"], input[type="radio"] {
min-width:30px;
Expand All @@ -1686,39 +1695,41 @@ Hover Capability: the 'hover' feature</h3>
Type: discrete
</pre>

The 'hover' media feature is used to query the user's ability to hover over elements on the page.
If a device has multiple input mechanisms,
the 'hover' media feature must reflect the characteristics of the “primary” input mechanism,
The 'hover' media feature is used to query the user's ability to hover over elements on the page
with the primary pointing device.
If a device has multiple pointing devices,
the 'hover' media feature must reflect the characteristics of the “primary” pointing device,
as determined by the user agent.
(To query the capabilities of <em>any</em> available input mechanism,
(To query the capabilities of <em>any</em> available pointing devices,
see the 'any-hover' media feature.)

<dl dfn-type=value dfn-for="@media/hover">
<dt><dfn>none</dfn>
<dd>
Indicates that the primary pointing system can't hover,
or there is no pointing system.
Examples include touchscreens and screens that use a drawing stylus.
Indicates that the primary pointing device can't hover,
or that there is no pointing device.
Examples include touchscreens and screens that use a basic drawing stylus.

Pointing systems that can hover,
Pointing devices that can hover,
but for which doing so is inconvenient and not part of the normal way they are used,
also match this value.
For example, a touchscreen where a long press is treated as hovering
would match ''hover: none''.

<dt><dfn>hover</dfn>
<dd>
Indicates that the primary pointing system can easily hover over parts of the page.
Indicates that the primary pointing device can easily hover over parts of the page.
Examples include mice and devices that physically point at the screen, like the Nintendo Wii controller.
</dl>

<div class='example'>
For example, on a touch screen device that can also be controlled by an optional mouse,
the 'hover' <a>media feature</a> should match ''hover/none'',
as the primary interaction mode (touching the screen) can't hover.
the 'hover' <a>media feature</a> should match ''hover: none'',
as the primary pointing device (the touch screen) does not allow the user to hover.

However, despite this, the optional mouse does allow users to hover.
Authors should therefore be careful not to assume that the ':hover' pseudo class
will never match on device where 'hover:none' is true,
will never match on a device where 'hover:none' is true,
but they should design layouts that do not depend on hovering to be fully usable.
</div>

Expand Down Expand Up @@ -1786,6 +1797,9 @@ All Available Interaction Capabilities: the 'any-pointer' and 'any-hover' featur
As such, it should be understood as a query to test if any hover-capable pointing devices are present,
rather than whether or not any of the pointing devices is hover-incapable.
The latter scenario can currently not be determined using 'any-hover' or any other interaction media feature.
Additionally, it does not take into account any non-pointing device inputs,
such as d-pads or keyboard-only controls,
which by their very nature are also not hover-capable.
</div>

<div class="example">
Expand All @@ -1797,15 +1811,16 @@ All Available Interaction Capabilities: the 'any-pointer' and 'any-hover' featur

<div class="note">
While 'pointer' and 'hover' can be used to design the main style and interaction
mode of the page to suit the primary input mechanism, 'any-pointer' and 'any-hover'
can be used to potentially take into account all possible types of pointers
mode of the page to suit the primary input mechanism (based on the characteristics, or complete absence,
of the primary pointing device), 'any-pointer' and 'any-hover'
can be used to potentially take into account all possible types of pointing devices
that have been detected.

Designing a page that relies on hovering or accurate pointing
only because 'any-hover' or 'any-pointer' indicate that at least one of the available
input mechanisms has these capabilities is likely to result in a poor experience.
However, authors may use this information to inform their decision about the style and
functionality they wish to provide based on additional input mechanisms that
functionality they wish to provide based on any additional pointing devices that
are available to the user.
</div>

Expand All @@ -1818,7 +1833,7 @@ All Available Interaction Capabilities: the 'any-pointer' and 'any-hover' featur

The user may also have paired a Bluetooth mouse with the TV,
and occasionally use it for extra convenience,
but such the mouse is not the main way the TV is operated.
but this mouse is not the main way the TV is operated.
'pointer' still matches ''coarse'', while 'any-pointer' now both matches ''coarse'' and ''fine''.

Switching to small click targets based on the fact that ''(any-pointer: fine)'' is now true
Expand Down