时间戳

首页 > 解决方案 > 使点击穿过一个元素到它后面的一个元素

javascript - 使点击穿过一个元素到它后面的一个元素

问题描述

我有一个 div，它用一些按钮跨越我的整个页面。然而，div 是透明的。我在 div 后面放了一个视频，我希望能够开始和停止。当然，只有当我按下不是按钮的地方时。但目前，div 正在消耗点击。我希望点击传播到它后面的元素。但是，我仍然希望它阻止滑动。

CSS

.root {
    display: grid;
    grid-template-columns: 0.7fr 1fr 0.7fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-template-areas: "left center right";
    height: 100vh;
    width: 100vw;
    position: absolute;
}

HTML

<div
   className="root"
   style={{
      display: "grid"
      width: `calc(100% - ${arg1? arg3: 0}px)`,
      height: `calc(100% - ${arg2 ? arg4: 0}px)`,
      backgroundColor: "#ffffff00",
   }}
   onClick={(ev) => {
      console.log("cl");
   }}
>

标签： javascripthtmlcssreactjs

解决方案

您需要pointer-events: none;css 属性。

推荐阅读