Why do no user-agents implement the CSS cursor style for video elements

我们两清 提交于 2019-12-07 13:10:21

问题


I'm trying to figure out if it is possible to change the CSS property for cursor on a default HTML5 video element. So far, my testing has concluded:

  1. No user-agents (browsers) implement cursor: pointer by default. So you are left with the normal OS arrow/control indicator

  2. When you attempt to set cursor: pointer, the user-agents will change the cursor ONLY when the cursor is not over clickable elements within the video element... ie: play, pause, seek, mute, fullscreen.

  3. This seems to be reverse the implementation of what SHOULD happen. The clickable elements of the video tag (control bar, center play button) should get the cursor style...or hell, just apply it to the whole thing.

Does anyone have any insight on this?


回答1:


For webkit you can target their pseudo elements

video::-webkit-media-controls-panel

video::-webkit-media-controls-play-button

video::-webkit-media-controls-volume-slider-container

video::-webkit-media-controls-volume-slider

video::-webkit-media-controls-mute-button

video::-webkit-media-controls-timeline

video::-webkit-media-controls-current-time-display

video::-webkit-full-page-media::-webkit-media-controls-panel

video::-webkit-media-controls-timeline-container

video::-webkit-media-controls-time-remaining-display

video::-webkit-media-controls-seek-back-button

video::-webkit-media-controls-seek-forward-button

video::-webkit-media-controls-fullscreen-button

video::-webkit-media-controls-rewind-button

video::-webkit-media-controls-return-to-realtime-button

video::-webkit-media-controls-toggle-closed-captions-button

Update

Extended list of webkit pseudo elements: https://gist.github.com/afabbro/3759334




回答2:


Why do no user-agents implement the CSS cursor style for video elements?

Because there's no need for it

This seems to be reverse the implementation of what SHOULD happen.

What do you think "should" happen? Pointers are not necessary for interactive elements. For example, if you hover over the scroll bar your arrow stays an arrow. In fact, most buttons for most computer software do not change the cursor. It's not necessary, as the hover & focus states of interactive elements are enough to afford clickability.

The reason cursor: pointer is common on the web, and the reason it's necessary is due to hyperlinks. Hyperlinks don't react on hover by default. A pointer is used to cue the user that the link can be clicked on.

For <video> elements, there are sufficient hover states that there's no need for the cursor to change.



来源:https://stackoverflow.com/questions/15126921/why-do-no-user-agents-implement-the-css-cursor-style-for-video-elements

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!