master

分支 (2)

管理

管理

master

wheel

x-scrollbar
/
原型.html

<!doctype html>
<html class="">

<head>
  <style>
    .x-scrollbar-container {
      scrollbar-width: none;
      -ms-overflow-style: none;
    }

    .x-scrollbar-container::-webkit-scrollbar {
      display: none;
    }
  </style>
</head>

<body>
  <div class="x-scrollbar" style="
    width: 300px;
    height: 300px;
    background: antiquewhite;
    overflow: hidden;
    position: relative;
  ">
    <div class="x-scrollbar-container" style="
      width: 100%;
      height: 100%;
      overflow: auto;
    ">
      <div class="x-scrollbar-content" style="
        display: inline-block;
        vertical-align: middle;
        min-width: 100%;
      ">
        <div style="
          width: 500px;
          height: 500px;
          border: 1px solid;
        "></div>
      </div>
    </div>
    <div class="x-scrollbar-x" style="
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 8px;
      background: #00ffff4f;
    "></div>
    <div class="x-scrollbar-y" style="
      position: absolute;
      right: 0;
      top: 0;
      width: 8px;
      height: 100%;
      background: #00ffff4f;
    "></div>
  </div>
</body>

</html>