我想停止加载视频时，网站正在显示在手机上，但它应该加载在桌面屏幕大小。附言-我说的是加载/不加载一个元素或组件。请不要通过告诉改变css属性来给予答案（显示：无，可见性：隐藏）。我使用的是带显示屏的iPhone：无，视频不显示。但是，视频在滚动时自动播放，并在Safari的视频播放器中随机播放。
jhiyze9q1#
你可以尝试track the width of device，并根据它只是有条件地渲染组件与视频。
8yparm6h2#
您可以在屏幕宽度上使用@media查询，直接将CSS应用于特定的HTML元素，如下所示。
@media
CSS
HTML
@media screen and (max-width: 480px) { body { background-color: red; } }
供参考-Media Queries要停止React代码中的操作，可以使用window对象中的innerWidth属性。
window
innerWidth
ubbxdtey3#
display: none和visibility: hidden对页面加载时间没有影响。如果您希望等到需要时再加载内容，则在您知道设备的宽度大于940之前，根本不要包含视频HTML组件
display: none
visibility: hidden
const renderVideo = () => { const {innerWidth} = window; return (innerWidth > 940 && <video ..../> }
3条答案
按热度按时间jhiyze9q1#
你可以尝试track the width of device，并根据它只是有条件地渲染组件与视频。
8yparm6h2#
您可以在屏幕宽度上使用
@media查询，直接将CSS应用于特定的HTML元素，如下所示。供参考-Media Queries
要停止React代码中的操作，可以使用
window对象中的innerWidth属性。ubbxdtey3#
display: none和visibility: hidden对页面加载时间没有影响。如果您希望等到需要时再加载内容，则在您知道设备的宽度大于940之前，根本不要包含视频HTML组件