WebKit/Blink 브라우저의 macOS 트랙패드에서 스크롤 막대가 숨겨지는 것을 방지하려면 어떻게 해야 합니까?

WebKit/Blink에서 macOS 트랙패드 사용자의 스크롤 막대 숨김 방지

macOS 버전 10.7 이후에서는 WebKit/Blink 브라우저(예: Safari) , Chrome)을 사용하지 않을 때 트랙패드 사용자로부터 스크롤 막대를 자동으로 숨깁니다. 이 동작은 요소의 스크롤 가능성을 결정하는 데 필수적인 시각적 신호를 모호하게 할 수 있습니다.

기본 WebKit 동작:

Foo<br>
Bar<br>
Baz<br>
Help I'm trapped in an HTML factory!

프레스토 동작(예: Opera):

Foo<br>
Bar<br>
Baz<br>
Help I'm trapped in an HTML factory!

해결책: 스크롤 막대를 영구적으로 표시

스크롤 막대가 계속 표시되도록 하려면 WebKit, -webkit-scrollbar를 사용하여 모양 조작 의사 요소:

CSS:

.frame::-webkit-scrollbar {
    -webkit-appearance: none;
}

.frame::-webkit-scrollbar:vertical {
    width: 11px;
}

.frame::-webkit-scrollbar:horizontal {
    height: 11px;
}

.frame::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white;
    background-color: rgba(0, 0, 0, .5);
}

.frame::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 8px;
}

결과:

Foo<br>
Bar<br>
Baz<br>
Help I'm trapped in an HTML factory!

작성자: 기본 스크롤 막대 모양을 비활성화하고 사용자 정의 스타일을 정의하여 macOS 트랙패드 사용자에게 스크롤 막대가 계속 표시되도록 합니다.

위 내용은 WebKit/Blink 브라우저의 macOS 트랙패드에서 스크롤 막대가 숨겨지는 것을 방지하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!